Привет! В этом видео покажу, как сделать свой плагин видеоплеера, который будет поверх стандартного видео.
Содержание:
00:00 - Интро
02:40 - Создаем html-структуру
10:06 - Стилизуем элементы
30:26 - План работы над js-кодом, создаем класс
37:10 - Создаем глобальные переменные для класса
41:10 - Базовые методы для работы (создание, нахождение элементов и т.д.)
56:25 - Инициализация плагина
1:19:00 - Базовое управление видео (плей, пауза, мьют)
1:30:46 - Создаем события
1:45:30 - Работа с нажатиями и перетаскиваниями (таймлайн, громкость), а также фулскрин видео
2:17:10 - Связь со стандартными событиями видео
2:20:26 - Работа с клавиатурой
2:40:00 - Аутро
github.com/maxdenaro/maxgraph-youtube-source/tree/master/JS-%D1%80%D0%B5%D1%88%D0%B5%D0%BD%D0%B8%D1%8F%20%E2%84%9624.%20%D0%9F%D0%B8%D1%88%D0%B5%D0%BC%20%D0%BF%D0%BB%D0%B0%D0%B3%D0%B8%D0%BD%20%D0%B4%D0%BB%D1%8F%20%D0%BF%D0%BB%D0%B5%D0%B5%D1%80%D0%B0 - код
Доп. контент и поддержка канала:
❤️ boosty.to/maxgraph
❤️ www.donationalerts.com/r/maxdenaro
Полезные ссылки:
🤌 Макеты для верстки: verstaem.online/projects/
🤌 Задачки по верстке с решениями: verstaem.online/tasks/
🤌 Курс по верстке html-писем: verstaem.online/courses/html-emails/
🤌 Канал с полезностями в телеграм: t.me/maxgraph
🤌 Чат для верстальщиков: t.me/maxgraph_chat
🤙 ВК Видео: vk.com/video/@maxgraph
👋 Меня зовут Максим. Верстальщик, занимаюсь веб-разработкой 7 лет
Подписывайся: www.youtube.com/@maxgraph?sub_confirmation=1
#обучение #js_решения #video_player
Негізгі бет JS-решения №26. Создаем свой плагин видеоплеера
Пікірлер: 9