麻煩jQuery的工具改變fadeTo（）的淡入（）

Question

我使用jQuery Tools Scrollable with this setup。我無法改變大圖片上的過渡效果。

當你點擊縮略圖，大圖像淡出，和在（你可以看到visiting the link在演示這種行爲）。我只是淡入的大圖像。

我認爲這很簡單，只需將var wrap = ... fadeTo()中的轉換更改爲fadeIn()即可，但事實並非如此。我也改變了wrap.fadeTo()這一行的轉換，但這並不奏效。

任何想法爲什麼？我剪斷不必要的代碼從我的例子...

$(function() { 
    $(".scrollable").scrollable(); 

    $(".items img").click(function() { 
     if ($(this).hasClass("active")) { return; } 

     var url = $(this).attr("src").replace("_t", ""); 
     var wrap = $("#image_wrap").fadeTo("medium", 0.5); 
     var img = new Image(); 

     img.onload = function() { 
      wrap.fadeTo("fast", 1); 
      wrap.find("img").attr("src", url); 
     }; 

     img.src = url; 
     $(".items img").removeClass("active"); 
     $(this).addClass("active"); 
    }).filter(":first").click(); 
}); 

HTML

<div id="image_wrap">Large image goes here</div> 
<div class="scrollable"> 
    <div class="items"> 
     <div> 
      thumbnails go here 
     </div> 
    </div> 
</div> 

Answer 1

什麼是img？你可以不​​功能添加到已加載的東西，如果你還添加多個​​功能，1元，它會被加載，所有你之前綁定的​​功能也將被調用。

也許你不想在調用.fadeTo()方法之前先做一個.stop(true, false)，因爲如果你已經褪色，它會停止它，清除隊列並淡入到新的位置。所以你不必等待，直到它被部分加載。

更新

如果你不想淡出，但只淡入使用這樣的：

$(function() { 
    $(".scrollable").scrollable(); 

    $(".items img").click(function() { 
     if ($(this).hasClass("active")) { return; } 

     var url = $(this).attr("src").replace("_t", ""); 
     var wrap = $("#image_wrap"); // This line edited 
     var img = new Image(); 

     img.onload = function() { 
      wrap.css("opacity", 0.5).fadeIn(); // This line edited 
      wrap.find("img").attr("src", url); 
     }; 

     img.src = url; 
     $(".items img").removeClass("active"); 
     $(this).addClass("active"); 
    }).filter(":first").click(); 
});