如何在底部得到upsliding标题为kwicks的jQuery的手风琴图像滑块 [英] how to get a upsliding caption at bottom for the jquery accordion image slider of kwicks

查看:162
本文介绍了如何在底部得到upsliding标题为kwicks的jQuery的手风琴图像滑块的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用手风琴滑块。

一切进展顺利,除了我需要为每个图像,这将坐在各自的形象对某种背景(即灰色)底部个别文字。当正在显示的图像,与背景的文本将只是向上滑动图像。文字部分的高度将是小(如果图像高度为250像素,则文本部分高度为50像素)。

Everything is okay except I need for each of the images , individual text that will sit at the bottom of the respective image on a certain background (i.e. gray). While an image is being displayed, that text with the background will just slide up on the image. The height of the text part will be small (if the image height is 250px , then the text part height can be 50 px ).

人在那里只是告诉修改该JS和HTML的一部分,以何种方式?

Anybody out there just to tell which part of the js and html to be modified and in which way?

向上滑动效果或放置文本在图像是相当容易的,但我要寻找一个不那么小的情况下,解决方案(在我看来至少)脚本。

Sliding up effect or placing a text over an image is quite easy but I am looking for the solution in the case of a not-so-small (in my view at least ) script .

推荐答案

您将需要使用更新版本Kwicks 的其中一个具有回调。

You'll need to use an updated version of Kwicks one which has callbacks.

然后添加字幕,CSS的标题和下面的回调code(这里是一个的演示):

Then add the captions, css to position the captions and the following callback code (here is a 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();
    }

});

这篇关于如何在底部得到upsliding标题为kwicks的jQuery的手风琴图像滑块的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆