Простая карусель на JQuery для любого сайта с автопрокруткой и подписями
X
Заказать сайт
Заказать сайт

Простая карусель на JQuery для любого сайта с автопрокруткой и подписями

screen

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

СкринСразу оговорюсь о функционале - карусель с автопрокруткой, которую можно отключать или менять время самой прокрутки! Карусель может пролистывать фотографии только при нажатии стрелок вперед/назад. Многим веб мастерам нужна именно такая карусель. При большом желании ее можно легко доработать до автопрокрутки (по просьбам трудящихся уже сделал), например, используя периодический таймер в Java Script и зациклив действие на функции changeSlideMix().

Данная карусель работает на JQuery с небольшим скриптом. При клике на стрелку вперед или назад прокручивает строго по одной фотографии. Когда доходит до последней фото, то как бы перебрасывает первую в конец. Таким образом, получается красивая, как бы бесконечная прокрутка в карусели.

Особенность карусели еще в том, что она является адаптивной - как бы вы не уменьшали экран - она подстраивается под него (если ваши css стили не будут конфликтовать). Также можно установить несколько таких каруселей на сайте (но только без автопрокрутки (иначе меняйте селекторы в коде и каруселях)) - просто продублировав html код.

Некоторые особенности:
- Чтобы отключить автопрокрутку удалите или закомментируйте строку 20 в index.html.
- Чтобы изменить время прокрутки карусели в этой же строке поменяйте 2000 на свое число, где 1000 это 1 сек.
- Чтобы прокрутка шла слева направо поменяйте в 20 строке .slider-nextmix на .slider-prevmix
- Ширина самих блоков картинок сейчас 175px - меняется в ul.sm-slider li
- Обратите внимание на высоту карусели (.horizontal-slidermix) - сейчас 190px. При редактировании стилей, это может вам понадобится

Данная карусель отлично подойдет для лэндингов и любых сайтов с системой управления, например, Joomla или WordPress.

| | Простая карусель на JQuery для любого сайта с автопрокруткой и подписями | Если вам необходима обычная карусель, которая бы пролистывала изображения с подписями, то данный вариант карусели вам подойдет как никогда. Сразу о | https://blogprogram.ru/wp-content/uploads/2016/05/screen-131x131.png