На информационном ресурсе применяются cookie-файлы. Оставаясь на сайте, вы подтверждаете свое согласие на их использование.
не масштабируется при ресайзе?
        2910
                2
                
                
                    System32
                
                
        
        guru
            Имеем некий блок <video></video>
<video data-showcase-video webkit-playsinline poster="/videos/Oka_copyrightdownloopscom.jpg" loop autoplay>
<source src="/videos/background.webm" type="video/webm" />
<source src="/videos/background.mp4" type="video/mp4" />
<source src="/videos/background.ogg" type="video/ogg" />
</video>
Само видео размером 800 на 600 пикселей
его css
position: absolute;
z-index: 0;
top: 0px;
left: 0px;
width: 100%;
height: auto;
max-width: 100%;
backface-visibility: hidden;
Для того чтобы это видео растягивалось по горизонтали при увеличении разрешения экрана (например широкоформатый монитор), достаточно указать свойство
width: 100%; - это работает
Логично предположить чтобы растянуть видео по вертикали указать height: 100%;
Но это не работает. Свойство width: 100%; в этом случае отключается и по краям экрана имеет черные квадраты.
Как без применения js, растянуть видео и по вертикали тоже?
    <video data-showcase-video webkit-playsinline poster="/videos/Oka_copyrightdownloopscom.jpg" loop autoplay>
<source src="/videos/background.webm" type="video/webm" />
<source src="/videos/background.mp4" type="video/mp4" />
<source src="/videos/background.ogg" type="video/ogg" />
</video>
Само видео размером 800 на 600 пикселей
его css
position: absolute;
z-index: 0;
top: 0px;
left: 0px;
width: 100%;
height: auto;
max-width: 100%;
backface-visibility: hidden;
Для того чтобы это видео растягивалось по горизонтали при увеличении разрешения экрана (например широкоформатый монитор), достаточно указать свойство
width: 100%; - это работает
Логично предположить чтобы растянуть видео по вертикали указать height: 100%;
Но это не работает. Свойство width: 100%; в этом случае отключается и по краям экрана имеет черные квадраты.
Как без применения js, растянуть видео и по вертикали тоже?
попробуйте открыт в хроме какой нибудть пример  с видео и копипейстить стиль оттуда
вот здесь с модалем (всплывающем окном)
http://www.worldventuresfoundation.org/getinvolved/serviceexcursions
копипесччу с хрома 768px
 
 
В Network смотрю версию Video.js
Video.js - HTML5 Video Player
Version 3.2.0
пожалуйст используйте "code" таг когда пишите примеры кода
    вот здесь с модалем (всплывающем окном)
http://www.worldventuresfoundation.org/getinvolved/serviceexcursions
копипесччу с хрома 768px
@media screen and (max-width: 768px)
#wvf-video-modal.modal, #volountours-video-modal.modal, #video-modal.modal {
width: 97% !important;
left: 3%;
margin-left: -10px !important;
}
@media screen and (max-width: 768px)
#wvf-video-modal #video-1, #volountours-video-modal #volountours-video, #video-modal #video-1 {
width: 98% !important;
}
.video-js .vjs-tech {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}В Network смотрю версию Video.js
Video.js - HTML5 Video Player
Version 3.2.0
пожалуйст используйте "code" таг когда пишите примеры кода
вполне возможно, что использования video.js (скачайте) поможет
в коде вроде height 100% есть, но
не уверена, что ответила по существу вопроса
"растянуть видео по вертикали"
    в коде вроде height 100% есть, но
не уверена, что ответила по существу вопроса
"растянуть видео по вертикали"
ТОП 5
            2
                        
                    4