问题与jQuery灯箱插件库

我有以下画廊成立的jQuery： -问题与jQuery灯箱插件库

<script type="text/javascript"> 
    $(function() { 
     $(".image").click(function() { 
      var image = $(this).attr("rel"); 
      $('#galleryImage').hide(); 
      $('#galleryImage').fadeIn('slow'); 
      $('#galleryImage').html('<img src="' + image + '"/>'); 
      return false; 
     }); 
     $("#galleryImage").click(function() { 
      var imageLarge = $(this).attr("rel"); 
      $('#galleryImage').html('<a href="' + imageLarge + '"/>'); 
      $('#galleryImage a').lightBox(); 
     }); 
    });

<div id="galleryImage"> 

     <a href=""><img src="../../Images/Design/Gallery/HavellHouse/havellhouse-small1.jpg" width="337" height="223" alt="forbury court" /></a> 
</div> 

    <a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small1.jpg" class="image"> 
     <img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb1.jpg" class="thumb" border="0" /></a> 

    <a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small2.jpg" class="image"> 
     <img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb2.jpg" class="thumb" border="0" /></a> 

    <a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small3.jpg" class="image"> 
     <img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb3.jpg" class="thumb" border="0" /></a>

这需要点击缩略图时rel属性值，并将其插入galleryImage div允许用户通过全部显示在一个地方的缩略图选择不同的图像。

现在，我想要做的是将灯箱应用于#galleryImage div中的当前图像，以便如果用户单击它，通过lightbox插件会出现更大的版本，但我无法完全获得我的回头看看如何做到这一点，这是我迄今为止的目标，我是否正朝着正确的方向前进？

来源

2012-02-22 dtsg

bump for help .. – dtsg 2012-02-22 21:18:05

固定它，使用：

$(".image").click(function() { 
    var image = $(this).attr("rel"); 
    var imageLarge = $(this).attr("title"); 
    $("#galleryImage img").attr("src",image); 
    $("#galleryImage a").attr("href", imageLarge); 
    return false; 
}

使用其存储的URL到大的图像的标题值，从当前选择的缩略图拍摄和只设置在jQuery的属性值而不是插入一串HTML的right into the div

来源

2012-02-23 18:13:22 dtsg

问题与jQuery灯箱插件库

回答

相关问题