0

Использую плагин FancyBox v.3 и хочу сделать вызов галлереи картинок используя только одну кнопку, подскажите, в какую сторону смотреть? В документации не нашёл информации по этому поводу, есть вызов картинки 1 ссылка = одна картинка и это я без проблем могу воспроизвести... Но нужно одна ссылка и например 5 картинок.

1 ответ 1

1

У fancybox есть параметр data-fancybox, он объединяет вызываемые картинки в галерею.

Аналогичную Вашей задачу в свое время делал так. На первую "кнопку" навешиваем определенный data-fancybox, остальные картинки делаем скрытыми "блоками", и у них тоже навешиваем data-fancybox. И у всех "блоков" устанавливаем класс привязки к скрипту

$(document).ready(fuction(){

  $('.img').fancybox();

});
<script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>

<a href="https://i03.fotocdn.net/s119/9c4a25d1afe85016/public_pin_l/2730300326.jpg" class="img" data-fancybox="gallery1">Вызываем галерею</a>
<a href="https://pic.rutubelist.ru/video/17/b1/17b100a0bcbc6e5e8d11101cde21aca7.jpg" class="img" rel="gallery1"></a>
<a href="https://www.navigato.ru/content/news/image18553.jpg" class="img" data-fancybox="gallery1"></a>
<a href="https://bugaga.ru/uploads/posts/2017-03/1489052030_kotik-hosiko-12.jpg" data-fancybox="gallery1" class="img"></a>
<a href="https://pic.rutubelist.ru/video/93/93/9393f57541909bcad8dded541a681165.jpg" data-fancybox="gallery1" class="img"></a>

1
  • а не подскажете, как можно включить миниатюры и чтобы блок с миниатюрами был заранее открыт
    – dJoni .D
    14 сен 2022 в 20:25

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.