#5.9 Библиотека Swiper.js Слайдер на JavaScript

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

Слайдер изображений: https://swiperjs.com/

00:00 Вступление и краткий анонс
01:32 Подключение библиотеки к проекту
04:52 Обзор стартового шаблона
11:23 Обычный горизонтальный слайдер
13:52 Слайдер с пагинацией
14:32 Динамическая пагинация
15:22 Прогресс-бар пагинация
16:24 Числовая пагинация
17:06 Ручная настройка пагинации
20:15 Вертикальный слайдер
20:51 Отступы между слайдами
21:30 Несколько слайдов на странице
22:05 Центрирование слайда
22:55 Свободный режим перелистывания
23:35 Вертикальный слайдер с полосой прокрутки
25:28 Сетка из слайдов
26:22 Слайдер внутри слайдера
28:00 Курсор перетаскивания
29:25 Цикличный, бесконечный слайдер
30:10 Перелистывание по несколько слайдов за раз
31:55 Картинки на фон и анимация
33:02 Стили стрелок и пагинации, эффект куба
34:00 Эффект cover flow
34:28 Эффект flip, переворот
35:00 Автоматическое перелистывание
35:32 Галерея на базе слайдера
37:48 Параллакс фон
39:04 Оптимизация загрузки изображений
40:32 Адаптивный слайдер
42:22 Боковое меню из слайдера
43:08 Примеры из документации, готовый код
43:53 Подведение итогов

Уроки по языку JavaScript собраны в одном плейлисте для вашего удобства. В этом плейлисте вы узнаете основы языка программирования, без которых невозможно изучать библиотеки, фреймворки или создавать свои собственные интересные скрипты.

📌 Уроки по JavaScript - https://dzen.ru/suite/d4f334d9-738c-4a36-bcdb-bfd619e23ee8

Данный плейлист включает в себя видео лекции из курса "Frontend разработчик на HTML, CSS и JavaScript". Задания к этому курсу можно найти на платформе Stepik.

📌 Курс "Frontend разработчик на HTML, CSS и JavaScript" - https://stepik.org/a/113402

⚡️ Эксклюзив на Boosty - https://boosty.to/itdoctor
💡 Telegram канал - https://t.me/itdoctor_official/4
🎥 Курсы на Stepik - https://stepik.org/users/387773773/teach

YouTube - https://youtube.com/@ITDoctor
ВКонтакте - https://vk.com/itdoctorstudio
Rutube - https://rutube.ru/channel/23500045/

#javascript #js #itdoctor