Report

В шапке стоит видео, которое я через JS подгружаю и подгоняю под размер экрана. Но при первой загрузке страницы видео не растягивается по ширине экрана. Только если ресайзнуть окно. Что делать?
Тестируемое разрешение экрана 1366x768. Вот сам сайт и код:
var scWidth; var scHeight; function window_resize() { scWidth = (window.innerWidth > 0) ? window.innerWidth : screen.width; scHeight = (window.innerHeight > 0) ? window.innerHeight : screen.height; $('.scroll_bottom').css('display', (scHeight < scWidth ? 'block' : 'none')); var mainmenu = $('.mainmenu'); var mainvideo = $('#mainvideo'); if (scWidth > 767) { if (mainvideo.length < 1) { mainmenu.prepend('<video muted autoplay loop class="video" id="mainvideo"><source src="/assets/video/bg.mp4" type="video/mp4"></video>'); mainvideo = $('#mainvideo'); } mainvideo.attr('style', ''); if (mainvideo.height() < mainmenu.height()) { // Делаем по всей высоте scale = mainmenu.height() / mainvideo.height(); mainvideo.css('height', mainmenu.height() + 'px'); mainvideo.css('width', (mainvideo.width() * scale) + 'px'); if (mainvideo.width() > mainmenu.width()) { trim = (mainvideo.width() - mainmenu.width()) / 2; mainvideo.css('left', -trim + 'px'); } } else { // Делаем по всей ширине scale = mainmenu.width() / mainvideo.width(); mainvideo.css('width', mainmenu.width() + 'px'); mainvideo.css('height', (mainvideo.height() * scale) + 'px'); if (mainvideo.height() > mainmenu.height()) { trim = (mainvideo.height() - mainmenu.height()) / 2; mainvideo.css('top', -trim + 'px'); } } } else if (mainvideo.length) { mainvideo.remove(); } } window_resize(); $(window).resize(window_resize);  
В атрибуте style ему задана правильная ширина, но само видео почему-то по ней не растянулось. Только после ресайза окна растягивается

Всем доброго времени суток. В процессе работы над очередным проектом столкнулся с проблемой: есть элемент video, который расположен внутри элемента для которого заданы transform: translateX и transition. Если перейти в полноэкранный режим видео, а потом его свернуть (вернуть в нормальный режим), то родительский контейнер анимируется. Копаясь в консоли разработчика обнаружил, что на время полноэкранного режима для всех родителей тега video сбрасываются некоторые css стили (в т.ч. transform и transition), что похоже и приводит к появлению анимаций после выхода из fullscreen. Применение флага important к моим стилям результата не принесло (кроме того что после этого еще и само видео при переходе в полноэкранный режим начало анимироваться). Прошу помочь мне разобраться с этим нелегким делом.
Пример проблемы: https://codepen.io/ows_nightwolf/pen/mmeByp

Всем привет!
Заметил такую особенность, что при удалении тега <video> со страницы и даже при обnull'ении переменной видео все равно продолжает скачиваться с сервера. 
Как можно оставить загрузку?
Спасибо!

Здравствуйте! 

Не могу понять, как убрать чёрные полосы по бокам видео. 
Вот скриншот
А вот сам код : 
 
<div class="video-container"> <iframe src="https://vid.me/e/VWeY?stats=1" height="315" width="560" allowfullscreen="" frameborder="0"> </iframe> </div>  
.video-container { position: relative; padding-bottom: 58.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe { position: absolute; top:0; left: 0; width: 100%; height: 100%; } Благодарю за ответ!

Здравствуйте.
Каким-то образом можно остановить воспроизведение видео, которое выводиться с помощью iframe? И при возможности отключить его автозапуск.
Нашел решение менять src, но в хроме оно все равно начинает воспроизводится.