Как реализовать данную функцию в слайдерах?

Question

[Герман Зуяков]

Есть два слайдера, нужно чтобы при клике на элементы одного слайдера менялись элементы второго. Честно даже не придумаю как это можно реализовать. Может у вас есть какие-то идеи?

Comments

[Павел]

вот так бы сделал и не парился

$(элемент).клик{
    функция листнуть первый слайдер;
    функция листнуть второй слайдер;
}

[Герман Зуяков]

Павел, Там немного другая проблема, нужно что-бы поменялись на совсем другие эллементы, например на картинке у нас активен покорн и на вотром слайдере у нас вариации покорна, а если активный эллемент сладкой ваты то на втором слйдере вариации сладкой ваты и т.д.

[Павел]

Герман Зуяков, тогда слайдер + табы, при клике на элемент в первом слайдере открывается таб , а там уже додумать не проблема

Answer 1

[ArtJH]

используй data в html
Потом в js когда кликаешь на элемент, забираешь у него содержимое data.
Далее ищешь такое же значение data у второго слайдера и меняешь как тебе нужно

Comments

[Герман Зуяков]

Можешь подробно рассказать, просто я новичок и не всё понимаю)

[ArtJH]

Герман Зуяков, https://developer.mozilla.org/ru/docs/Web/Guide/HT...
Для подробней инфы почитай это

[ArtJH]

Герман Зуяков, а вообще читай доки по слайдеру который ту используешь. Не знаю какой у тебя там slick или swiper. Потому что обычно уже есть готовые решения. Но итак можно как я предложил

[ArtJH]

Герман Зуяков, А чел стой. Ты хочешь чтоб у тебя активные слайды менялись вместе со вторым слайдером?
если это так, то намного проще можно сделать. Их можно связать между собой и все. Это пару строчек кода

[Герман Зуяков]

ArtJH, Да, но я не понимаю как именно это сделать можешь пример какой-то сделать, буду очень благодарен

[ArtJH]

Герман Зуяков,
Если используешь slick.js

$(".slider2").slick({ asNavFor: '.slider' });
$(".slider3").slick({ asNavFor: '.slider2' });

Не забудь отметить решением)

[Герман Зуяков]

ArtJH, я использую owl

[ArtJH]

owl сам не использовал, но там тоже так можно
Вот решение
https://stackoverflow.com/questions/47042846/owl-c...

[Герман Зуяков]

ArtJH, Спасибо, но либо я не всё до конца понял, либо это не совсем то что мне нужно

Answer 2

[Дима Долготер]

slick slider может так. вот недавно делал mteco.pl/products/products1