Mixitup 2 блока на странице для фильтрации элементов


Mixitup достаточно удобен для фильтации и сортировки элементов на сайте. Помимо функционала фильтрация осуществляется с впечатляющей анимацией. Все прекрасно, но возник случай, когда понадобилось разместить на странице 2 разных блока с mixitup.  Т.е два независимых набора элементов, в которых сортировка происходит по своим категориям. В связи с невероятно малым количеством информацией по данной проблеме я поделюсь ей с вами.

 

 

Все исходники для mixitup’а вы можете найти на их официально странице https://www.kunkalabs.com/mixitup/

Подключение

jQuery

И сам Mixitup

 

HTML

В блоках с элементами главное указать data-ref="container-1" и data-ref="container-2" для дальнейшего их отличия. И после блоков с помощью <script> подключить необходимые mixitup блоки.

 

И на этом все. Это будет достаточно, чтобы подключить два или более сортируемых блоков mixitup на одной странице.