自定義jQuery圖庫縮略圖行爲

我最近從SLaks（謝謝）獲得了一些關於我的自定義圖庫行爲的幫助。我現在正在嘗試修復縮略圖的功能。我一直在玩它一個小時左右，但我無法實現它的工作。現行版本的代碼：http://www.studioimbrue.com。目前，代碼如下：自定義jQuery圖庫縮略圖行爲

$('.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(); 
});

唯一的問題是，當點擊圖庫圖像時，它進入下一個圖像中的系列，但縮略圖不改變在列表中的下一個。你可以看看我以前的問題來看看我們的討論。由於

來源

2010-04-26 steve

像這樣：

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

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

這必須是在同一塊

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

來源

2010-04-26 00:24:15 SLaks

哈，再次感謝你。它似乎沒有工作。我現在看，但我不明白爲什麼... http://www.studioimbrue.com/index2.php – steve 2010-04-26 00:42:52

你需要把我的代碼放到'''''next''之後的'click'處理程序中，並且使用'var'語句將整個單擊處理程序（來自其他答案）放在塊中。 – SLaks 2010-04-26 00:47:26

啊好的。你真棒！...我有很多要學習哈哈。現在唯一的問題是（檢查index2.php）首先它不會滾動瀏覽圖庫，但是一旦你激活了不同的縮略圖，它就會開始正常工作。我們現在的代碼已經超出了我的範圍，所以我有點迷路了... – steve 2010-04-26 00:53:19

自定義jQuery圖庫縮略圖行爲

回答

相關問題