Главная | Видеофон для сайта

Видеофон для сайта

Возможность использовать в качестве фона для сайта любой видеоматериал - это широчайшие возможности для Вашей буйной фантазии!
 
На этом сайте в качестве background использованы видеофайлы, найденные и скачанные с ЮТУБ-а.
 
Использовано 2 ролика разного формата - WEBM и MP4, хотя можно было обойтись только одним MP4. Но WEBM - более "продвинутый" формат, поддерживаемый практически всеми современными браузерами, а формат MP4 предназначен только для IE (шоб он скис!).
 
Можете проверить сами в разных браузерах. Ролики на этом сайте РАЗНЫЕ, соответственно, например, в ХРОМ-е и IE будут отображаться РАЗНЫЕ видеофоны.
 
Этот код можно разместить в шаблоне для всех страниц сайта, для отдельных его разделов, или только на определенных страницах.
 
Код:
  • autoplay - автозапуск
  • loop - повторение цикла просмотра, т.е. переход с последнего кадра на первый. Учтите, что при их несовпадении будет заметны скачкИ видеопотока. А если его (loop) не указывать, то видео остановится на последнем кадре статической картинкой. Реализация того или иного варианта зависит только от вашей творческой фантазии.
CSS:
 
object-fit - управление соотношением сторон и способом масштабирования. Сохраняет, или искажает пропорции. Может принимать значения:
  • cover - видео масштабируется с сохранением пропорций, чтобы целиком заполнить заданную область. Т.е. при несовпадении пропорций видео и экрана правый-левый, или верхний-нижний края ролика могут уйти ЗА пределы экрана.
  • fill - видео масштабируется без сохранения пропорций, чтобы соответствовать заданным размерам. Т.е. при несовпадении пропорций видео и экрана картинка будет сжата, или растянута - по вертикали, или горизонтали.





Связанные документы

Печать | Copyright © 2009 - 2017 1i3.ru All rights reserved