Как реализовать сортировку в слайдере на JS или с помощью slick slider?

Question

[X-Newbie]

У меня есть слайдер-галерея на slick.js, помимо этого, есть некое меню. В меню есть кнопка "пейзажи". Нужно, чтобы при нажатии на эту кнопку исчезало всё, кроме пейзажей, то есть определённые slider-element'ы, которые я задам. Реализовать я хотел бы с помощью slick.js или ванильного js. Но можно иначе.

Answer 1

[Сергей delphinpro]

Посмотрите документацию https://github.com/kenwheeler/slick/#methods
Есть методы для удаления/добавления/фильтрации слайдов.
Вам, в принципе, подойдут slickFilter/slickUnfilter
Просто добавьте слайдам какой-то признак принадлежности к определенной категории. Например класс.

Comments

[X-Newbie]

Возможно ли этим методом сделать несколько фильтров? У моего слайдера 4 категории.

[Сергей delphinpro]

X-Newbie,

button1@onclick => $('.your-element').slick('slickFilter', '.category1');
button2@onclick => $('.your-element').slick('slickFilter', '.category2');
button3@onclick => $('.your-element').slick('slickFilter', '.category3');