Question

你好我正在做一个你点亮大拇指的画廊，每个人都选择主图像，如果你想要主图像你想要得到一个叠加，那个叠加里面是图片和一些额外的HTML。

获得90％的代码

我只使用jquerytools ..问题是当你选择第二个拇指时...你得到的叠加是thumb1的叠加..即使我确实改变了相应的（rel =“＃target”）。所以我想我正在做或缺少别的东西..

请有人向我解释为什么即使在相应的rel之后，也就是更改，触发器始终为item1。

提前致谢。

这是脚本

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

$(".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", "");

    var relo = $(this).attr("relo");

    // 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);
        wrap.find("img").attr("rel", relo);

    };

    // 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();
});

// This makes the image Overlay with a div and html

  $(document).ready(function() {
      $("img[rel]").overlay();
    });

Answer 1

好吧至少我终于让它工作了......现在我只需要构建一个NEXT和PREV按钮。但我会尝试，直到我真的不能然后我问..感谢无论如何.. 这是代码，如果它符合某些人的需要。

<script>
$(function() {
$(".scrollable").scrollable();

$(".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);
    var wrap2 = $("#mies1");

    // 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);
        wrap2.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();
});


// This makes the image Overlay with a div and html

  $(document).ready(function() {
      $("img[rel]").overlay();
    });
</script>

图像库与Overlay和html内部倾斜正确的图像。 jQuery的

1 个答案: