Проблема с плагином / галереей лайтбокса jQuery - PullRequest
Новая
       12

Проблема с плагином / галереей лайтбокса jQuery

1 голос
/ 22 февраля 2012

В 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, позволяя пользователю выбирать разные изображения с помощью миниатюр, которые все отображаются в одном месте.

Теперь я хочу применить лайтбокс к текущему изображению в элементе #galleryImage, чтобы, если пользователь щелкнет по нему, через плагин лайтбокса появилась еще более крупная версия, но я не могу получить Я думаю, как это сделать, это то, что я имею до сих пор, я иду в правильном направлении?

1 Ответ

2 голосов
/ 23 февраля 2012

Исправлено, использовано: 

$(".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 прямо в div

...