Как сделать чтобы слайдер начинался с элемента на который кликнули?

Question

[Вадим Ягофаров]

galkam.ru/pamatniki/mramornyie.html Есть страница, на ней расположены карточки товара. При клике на карточку товара открывается модальное окно, а в нем слайдер.

$('.modal').on('shown.bs.modal', function () {
  $('.slider__prod').slick({
            arrows: true,
            prevArrow: '<button class="slick-prev slick-arrow" aria-label="Prev" type="button" style=""><i class="fa fa-chevron-left" aria-hidden="true"></i></button>',
            nextArrow: '<button class="slick-next slick-arrow" aria-label="Next" type="button" style=""><i class="fa fa-chevron-right" aria-hidden="true"></i></button>'
       });
})

Сейчас при клике на любом товаре слайдер открывается с первого элемента. Как сделать чтобы слайдер начинался с выбранного элемента?

Comments

[ProjectSoft]

Дал бы ответ, но вижу, что потом вы переделывать энто будете.
Вы не учитываете ещё фильтр.

[Вадим Ягофаров]

ProjectSoft, а у вас есть пример?

[Вадим Ягофаров]

ProjectSoft, Я вот даже не могу составить алгоритм того с чего начать или вообще как это реализовать

[ProjectSoft]

Вадим Ягофаров, можно посмотреть на метод фильтрации в документации slickFilter Принцип api.jquery.com/Filter
В доке slick это есть - kenwheeler.github.io/slick
А по клику узнать индекс из видимых элементов.
Что-то типа такого

$(".col[data-tags] a").on('click', function(e){
	var index = $(".col[data-tags]:visible a").index(this);
	/*
	** Инициализация слайдера с параметром фильтра и установкой индекса
	*/
})

Answer 1

[iBird Rose]

Тебе нужен вот этот параметр:

kenwheeler.github.io/slick