Как slick слайдер добавить в popup?

Question

[Novamoscow]

Есть настроенный слайдер, использую слик. посмотреть можно тут

Долго мучился, но настроил. И тут вдруг заказчик захотел, чтобы при нажатии картинка увеличилась и так же листалась.

Возможно ли это сделать силами Slick или подключить magnificPopup так, чтобы он не конфликтовал уже с готовым слайдером.

Answer 1

[Евгений]

Натравите на слайдер lightbox

Answer 2

[Андрей Токмаков]

А чем не устраивает тот же лайтбокс и т.п.? Картинка открывается при клике и листай сколько хочешь все картинки из этой группы

Comments

[Novamoscow]

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

[Андрей Токмаков]

И переписывать ни чего не надо, только подключить файлы и добавить ссылкам на картинки rel="lightbox[roadtrip]"

[Андрей Токмаков]

Novamoscow: Совершенно верно, там всё предельно просто https://habrahabr.ru/post/3601/

[Novamoscow]

Андрей Токмаков: Можно с тобой списаться где нибудь в телеграмме, на почте или еще где то ? Вопрос по подключению. На хабре написанно что нужно целых 3 файла подключить, а в репозитории у него есть просто файл для JQ без всего, вот не пойму, он подойдет или что то еще нужно

[Андрей Токмаков]

Novamoscow: https://vk.com/seewap

Answer 3

[Сергей Горячев]

Я для подобных задач использую LightSlider + LightGallery.

Comments

[Novamoscow]

Суть задачи в том, чтобы не переписывать все слайдеры.

Answer 4

[prodavec macdonalds]

слайдеры создают вспомогательные слайды, сликслайдер создаёт лишние до первого, я решил эту проблему принудительным удалением атрибута и класса слайдера попапа(в моём случае это был fancybox) уродский костыль, поэтому обычно пишу слайдеры сам либо использую cycle2

$('.slide__item.slick-slide').each(function(i, elem){
            if ($(this).attr('data-slick-index') < 0) {
                $(this).find('a').removeClass('fancybox-image-slider').removeClass('fancybox-modal').attr({
                    rel: ''
                });
            }
        });