开发者

How can I reference the 'active' item in an instance of jQuery serialScroll?

开发者 https://www.devze.com 2023-02-16 03:58 出处:网络
I\'m coding a feature for a photographer that is very similar to a slideshow. I\'ve 开发者_如何学Pythondecided to use the jQuery serialScroll plugin (which piggybacks on the scrollTo plugin) to achiev

I'm coding a feature for a photographer that is very similar to a slideshow. I've 开发者_如何学Pythondecided to use the jQuery serialScroll plugin (which piggybacks on the scrollTo plugin) to achieve this affect. I based my code off of the slideshow on the serialScroll demo page, which is almost exactly the functionality that I was looking for.

I've got the code working successfully, but I'd like to achieve one more effect. If possible, I'd love for the items in my slideshow (in my case, <li> elements), to be semitransparent by default, with only the current (or "active," or "selected") item showing at 100% opacity.

I can control the transparency with CSS easily, but I am struggling to track the last item that serialScroll has animated to. How can I interact with the currently "active" item via jQuery so that I can give it a class or perform other actions?


you can do this is different ways,you can add an attribute to your <li> tags, or you can use class like this:

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

and with this code in jQuery you can change the active element.

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

and with this one you can grab the active one

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

精彩评论

暂无评论...
验证码 换一张
取 消