Не хотів сьогодні писати в блог, тому що весь день пройшов за роботою над корпоративним проектом, але потім отримав лист від читача і вирішив відразу написати відповідь у вигляді окремої статті. Питання звучало так: «Як ти робиш карусельки для своїх сайтів? ». Відповідаю коротко: за допомогою jQuery-плагіна. Подібних плагінів написано вагон, але я вже давненько підсів на jCarousel.
Підключення плагіна jCarousel
Плагін підключається без будь-яких проблем. Все що потрібно - наявність jQuery (1.7 і вище) і списку з зображеннями, які будуть міститися карусель. Далі все просто.
2. Готуємо розмітку. У списку у нас повинні бути всі зображення, які будуть крутитися в каруселі.
3. Після готовності документа запускаємо плагін.
4. Визначаємо мінімальні стилі для оформлення
Ось, мабуть, і все. Реальні приклади використання jCarousel можна подивитися на офіційному сайті. Крім jCarousel мені також доводилося працювати зі slick. Я побачив його в проекті, який мені довелося допрацьовувати. Він теж responsive. підтримує swipe, з коробки дружить з клавіатурою (можна перегортати стрілками) і мишкою, лінива завантаження зображень і т.д. Обов'язково придивися і до нього.
Що вибрати jCarousel або Slick
Мені подобаються обидва рішення. У більшості своїх проектів я використовував jCarousel. тому познайомився з ним вже давно і він мене у всьому влаштовує. У нових вже намагаюся використовувати Slick. Деякі штуки (наприклад, лінива завантаження зображень) переманюють на свою сторону.