Как сделать автовоспроизведение видео на сайте html

Атрибут autoplay

При наличии этого атрибута видео начинает воспроизводиться автоматически после загрузки страницы. Атрибут autoplay отменяет действие preload .

Синтаксис

Значения

В качестве значения указывается autoplay , также допустимо вообще не указывать никакое значение.

Значение по умолчанию

По умолчанию этот атрибут выключен.

HTML5 IE 9+ Cr Op Sa Fx

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Автоматическое воспроизведение видео после загрузки страницы

Как добавить видео на сайт, чтобы оно автоматически запускалось без пользователя, например как на сайте https://morgenshterntour.ru? Через какие ЯП это делается или это можно через верстку?

Отслеживать
28.2k 12 12 золотых знаков 76 76 серебряных знаков 143 143 бронзовых знака
задан 5 мая 2020 в 11:11
Daniil Apekalovsky Daniil Apekalovsky
63 1 1 серебряный знак 5 5 бронзовых знаков
посмотрите: htmlbook.ru/html/video/autoplay
5 мая 2020 в 11:20

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

Атрибут autoplay — при наличии этого атрибута видео воспроизводится автоматически после загрузки страницы. Кроме этого, крайне важно также добавить и атрибут muted , иначе в некоторых браузерах автоматического воспроизведения не будет.

Отслеживать
ответ дан 5 мая 2020 в 11:33
Sevastopol’ Sevastopol’
28.2k 12 12 золотых знаков 76 76 серебряных знаков 143 143 бронзовых знака
Правильно. И важно не забыть muted , иначе некоторые браузеры не станут автоматически играть видео.
5 мая 2020 в 11:40
Там есть ещё атрибут, который говорит браузеру, что видео — это фон.
5 мая 2020 в 12:24
@Qwertiy, какой атрибут, я его не встречал и щас не нашел. Будь другом подскажи.
6 мая 2020 в 5:17
@Air, если б я помнил, я бы сразу написал.
6 мая 2020 в 7:10
@Qwertiy, OK.
6 мая 2020 в 7:45

Если говорится о видео фоне то достаточно html и css и в качестве атрибутов к тегу видео добавить autoplay muted preload

div.body < position: fixed; top: 0; left: 0; min-width: 100vw; min-height: 100vh; >video < display: block; min-width: 110vw; min-height: 100vh; position: absolute; top: 0px; left: -10px; object-fit: contain; >.play

Отслеживать
ответ дан 5 мая 2020 в 13:09
Резидент Казахстана Резидент Казахстана
13.5k 2 2 золотых знака 19 19 серебряных знаков 62 62 бронзовых знака
Я не уверен, что такая ссылка не умрёт через несколько дней
5 мая 2020 в 13:21
@andreymal я вообще не знаю где брать ссылки на видосы для демонстрации
5 мая 2020 в 13:23

@MaximLensky Как ты такую ссылку сделал и где их вообще брать? Я просто только начинающий и вообще не в чем не разбираюсь

5 мая 2020 в 18:12

@DaniilApekalovsky надо видео скачать просто и указать путь (src) у тебя в проекте, вот щас к примеру ссылка не рабочая

Автовоспроизведение видео

Атрибут controls добавляет панель управления к видеоплееру.

См. также

• Адаптивное встраивание
• Видео на сайте
• Добавление медиа-контента

Темы практики

Популярные задачи

• Картинки в таблице
• Добавление аудио
• Картинка в
• Привет, мир!
• Плавное изменение цвета
• Открывающие и закрывающие теги
• Абсолютный адрес
• Элемент
• Зацикливание аудио
• Подключение CSS-файла

Гл. редактор: Влад Мержевич

О сайте

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

Связи

Разделы сайта

Популярное

• Уроки по HTML и CSS
• Руководство по флексбоксам
• HTML5 и CSS3 на примерах
• Руководство по JSON
• Как верстать на HTML5 и CSS3
• Продвинутые уроки по HTML и CSS
• Визуальное руководство по свойствам flexbox
• Создание первого приложения на Node

Помощь по сайту

Сайт WebReference.ru использует VPS от компании Beget.

Атрибут autoplay HTML тега video

Атрибут autoplay является атрибутом-переключателем. Если данный атрибут указан, то видеофайл начнет воспроизводиться сразу же, как только это будет возможно.

В XHTML минимизация атрибутов запрещена, поэтому атрибут autoplay должен определяться как .