我正在为摄影师编写一个与幻灯片非常相似的功能。我决定使用jQuery serialScroll插件(它寄存在scrollTo插件上)来实现这种效果。我将代码基于serialScroll demo page上的幻灯片显示,这几乎就是我正在寻找的功能。
我已经成功运行了代码,但我希望再获得一个效果。如果可能的话,我喜欢幻灯片中的项目(在我的情况下,<li>
元素),默认情况下是半透明的,只有当前(或“活动”或“选定”)项目显示在100%不透明度。
我可以轻松地用CSS控制透明度,但我很难跟踪serialScroll动画的最后一项。如何通过jQuery与当前“活动”项目进行交互,以便我可以给它一个类或执行其他操作?
答案 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()