如何在jQuery serialScroll的实例中引用“active”项?

时间:2011-03-09 06:42:35

标签: javascript jquery scrollto serialscroll

我正在为摄影师编写一个与幻灯片非常相似的功能。我决定使用jQuery serialScroll插件(它寄存在scrollTo插件上)来实现这种效果。我将代码基于serialScroll demo page上的幻灯片显示,这几乎就是我正在寻找的功能。

我已经成功运行了代码,但我希望再获得一个效果。如果可能的话,我喜欢幻灯片中的项目(在我的情况下,<li>元素),默认情况下是半透明的,只有当前(或“活动”或“选定”)项目显示在100%不透明度。

我可以轻松地用CSS控制透明度,但我很难跟踪serialScroll动画的最后一项。如何通过jQuery与当前“活动”项目进行交互,以便我可以给它一个类或执行其他操作?

1 个答案:

答案 0 :(得分:1)

您可以通过不同的方式执行此操作,您可以为<li>标记添加属性,也可以使用以下类:

<ul>
<li class="active">test1</li>
<li>test2</li>
<li>test3</li>
</ul>

使用jQuery中的代码,您可以更改活动元素。

$('ul li').click( function () {
$(this).parent().children().removeClass('active');
$(this).addClass('active');
});

用这个你可以抓住活动的那个

$('ul li.active').html()