Не открывается fancybox при передаче клика на слайд фотогалереи

Question

Вот HTML

<a href="#" data-gallery-btn = "object_slider_1">
    <p>Еще фото</p>
</a>

<div data-gallery = "object_slider_1">
    <a href="img/sl_miniature_2.jpg" data-fancybox="gallery_1" ></a>
    <a href="img/sl_miniature_2.jpg" data-fancybox="gallery_1" ></a>
    <a href="img/sl_miniature_2.jpg" data-fancybox="gallery_1" ></a>
</div>

Вот JS

$(document).on("click", "[data-gallery-btn]", function(e) {
    e.preventDefault();
    galleryName = $(this).attr("data-gallery-btn");
    gallery = $("[data-gallery = '"+galleryName+"']");
    gallery.find("a").trigger("click");  // по моему не срабатывает эта строка кода
});

Нужно чтобы при клике на [data-gallery-btn] открывалась fancybox галерея [data-gallery]. Как это сделать?

Answer 1

gallery.find("a").click();

Answer 2

if ($('a.gallery').length) {
    var fancyGallery = $('a.gallery');

    fancyGallery.attr("rel","gallery").fancybox({
      type: "image"
    });
  }

присвойте класс тегу 'a' (например как в у меня это класс "gallery") и инициализируйте плагин. Картинкам добавьте атрибут rel=' ', для объединения картинок в одну галерею.

Ответ Виктора, тот, что выше, имеет самый краткий вариант инициализации. Но плагину нужно обязательно инициализироваться и понять на какие элементы ему реагировать.

Мой же скрипт имеет еще первоначальную проверку наличия на странице fancybox галерей.

Answer 3

<a href="javascript:;" class="miniature_thumb_more" data-fancybox-trigger="gallery_1">Еще фото</a>

<a href="img/sl_miniature_2.jpg" class="gallery_1" data-fancybox="gallery_1" >
    <img src="img/sl_miniature_2.jpg" alt="" />
</a>
<a href="img/sl_miniature_2.jpg" class="gallery_1" data-fancybox="gallery_1" >
    <img src="img/sl_miniature_2.jpg" alt="" />
</a>
<a href="img/sl_miniature_2.jpg" class="gallery_1" data-fancybox="gallery_1" >
    <img src="img/sl_miniature_2.jpg" alt="" />
</a>

БЛОГ НА HUSL

Не открывается fancybox при передаче клика на слайд фотогалереи

Ответы (3 шт):