开发者

Custom jQuery Gallery Thumbnail Behavior

I recently got some help on here from SLaks (thank you) on the behavior of my custom galler开发者_开发技巧y. I'm now trying to fix the way the thumbnails function. I've been toying with it for about an hour but I can't get it to work. Live version of the code: http://www.studioimbrue.com . Currently the code is as follows:

$('.thumbscontainer ul li a').click(function() {
var li_index = $(this).parents('ul').children('li').index($(this).parent("li"));

    $(this).parents('.thumbscontainer').parent().find('.captions ul li').fadeOut();
 $(this).parents('.thumbscontainer').parent().find('.captions ul li:eq('+li_index+')').fadeIn();
});

$('.container .captions li').click(function() {
    var nextLi = $(this).fadeOut().next().fadeIn();

    if (nextLi.length === 0)  //If we're the last one,
        nextLi = $(this).siblings(':first-child').fadeIn();
});

The only problem is that when the gallery image is clicked, it goes to the next image in the series, yet the thumbnails do not change to the next one in the list. You can take a look at my previous question to see our discussion. Thanks


Like this:

var nextThumb = nextLi
    .closest('.container')
    .find('.thumbscontainer li:eq(' + nextLi.index() + ')');

nextThumb
        .addClass(clickedClass).fadeTo(1, activeOpacity)
    .siblings()
        .fadeTo(1, inactiveOpacity).removeClass(clickedClass);

This must be in the same block as

var activeOpacity   = 1.0,
    inactiveOpacity = 0.6,
    fadeTime = 100,
    clickedClass = "selected",
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜