Привет! В этом видео - большой обзор лучшего (на мой взгляд) слайдера для сайта - swiper.js! Он написан на чистом js, имеет кучу настроек и очень удобен в использовании. Устраивайся поудобнее, в ближайший час я расскажу все самое основное при работе с данным плагином :)
clck.ru/PyQVz - Все примеры в одном месте, на GitHub :)
swiperjs.com/ - оф. сайт плагина
Содержание:
00:00 - Вступление
00:35 - Базовый слайдер (кол-во слайдов, их группировка, стили кнопок и точек)
18:00 - Выносим кнопки из слайдера
22:30 - Цифровая пагинация
24:13 - Автоплей слайдера
24:57 - Адаптация под разные устройства
27:50 - Делаем разную ширину слайдов
29:48 - Слайдер с увеличенным слайдом в центре
32:39 - Слайдер с тремя выделенными слайдами в центре
34:20 - Lazy load
37:23 - Вертикальный слайдер с превью
45:40 - Как сделать свои классы у слайдера
48:34 - Методы и события
56:34 - Как сделать несколько слайдеров на одной странице
01:02:30 - Слайдер на фоне секции с fade-эффектом
01:06:04 - Превращение в слайдер на мобильных устройствах
Меня зовут Максим Васянович. Фрилансер уже 5 лет, создал более 50 коммерческих сайтов. Преподаватель в онлайн-университете Skillbox, автор курса Веб-верстка.
Понравилось? clck.ru/Gr9Ec
Моя страница вконтакте: vk.com/maxdenaro
Моя группа по верстке сайтов: vk.com/maxgraph
Мой блог: blog.maxgraph.ru
Мой сайт: maxgraph.ru
Канал в телеграм: teleg.run/maxgraph
Чат для верстальщиков: teleg.run/maxgraph_chat
#обучение #swiperjs #слайдер
Негізгі бет Лучший слайдер для сайта на чистом JS! Подробный обзор плагина Swiper js
Пікірлер: 372