带有缩略图的jQuery工具库需要滑动而不是淡入淡出

时间:2012-05-12 16:21:50

标签: jquery jquery-tools

我目前正在尝试在jQuery工具上使用此图库来切换滑动图库而不是淡化。

http://jquerytools.org/demos/scrollable/gallery.html

我很好奇我将如何做到这一点。

$(".items img").click(function() {
// see if same thumb is being clicked
if ($(this).hasClass("active")) { return; }

// calclulate large image's URL based on the thumbnail URL (flickr specific)
var url = $(this).attr("src").replace("_t", "");

// get handle to element that wraps the image and make it semi-transparent
var wrap = $("#image_wrap").fadeTo("medium", 0.5);

// the large image from www.flickr.com
var img = new Image();


// call this function after it's loaded
img.onload = function() {

    // make wrapper fully visible
    wrap.fadeTo("fast", 1);

    // change the image
    wrap.find("img").attr("src", url);

};

// begin loading the image from www.flickr.com
img.src = url;

// activate item
$(".items img").removeClass("active");
$(this).addClass("active");

// when page loads simulate a "click" on the first image
}).filter(":first").click();

2 个答案:

答案 0 :(得分:0)

您可以使用以下某个事件

 $(<element>).slideIn(); // display image
 $(<element>).slideOut(); //remove image

答案 1 :(得分:0)

尝试var wrap = $("#image_wrap").animate("width", 0);