如何在kwicks的jquery手风琴图像滑块底部获得一个上升的标题

Question

我正在使用this手风琴滑块。

一切都没问题，除了我需要每个图像，单个文本将位于特定背景（即灰色）的相应图像的底部。在显示图像时，带有背景的文本将在图像上向上滑动。文本部分的高度将很小（如果图像高度为250像素，则文本部分高度可以为50像素）。

那里的任何人只是为了告诉js和html的哪一部分被修改以及以哪种方式？

在图像上滑动效果或放置文本非常容易，但我正在寻找一个不太小的（至少在我看来）脚本的解决方案。

Answer 1

您需要使用具有回调功能的updated version of Kwicks。

然后添加标题，css来定位标题和以下回调代码（这里是demo）：

$('#demo').kwicks({

    // event called before kwicks expanding animation begins
    expanding: function(kwick) {
        kwick.$kwicks.find('.caption').stop(true,true).slideUp();
        kwick.$active.find('.caption').stop(true,true).slideDown();
    },
    // event called before kwicks collapsing animation begins
    collapsing: function(kwick) {
        kwick.$kwicks.find('.caption').stop(true,true).slideUp();
    }

});