Как сделать встроенное видео на YouTube полной шириной страницы?
Здесь скрипка к коду: http://jsfiddle.net/dLPa8/
Если вы прокрутите вниз, появится видео, встроенное с YouTube. Что мне нужно, он должен покрывать всю высоту и ширину страницы. Я имею в виду, что он должен выглядеть как первый раздел (в скрипке).
Я пробовал это:
<iframe src="http://www.youraddress.com" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="100%" width="100%"></iframe>
Он решил проблему в определенной степени, но видео привязывается к верхней части страницы, используя выше iframe
. Как увеличить высоту видеоизображения в видеоразделах?
Ответы
Ответ 1
Здесь FIDDLE
<iframe id="video" src="//www.youtube.com/embed/5iiPC-VGFLU" frameborder="0" allowfullscreen></iframe>
$(function(){
$('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' });
// If you want to keep full screen on window resize
$(window).resize(function(){
$('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' });
});
});
Ответ 2
Попробуйте использовать innerHeight
или .clientHeight
:
var doc = document, bod = doc.body, dE = doc.documentElement;
var wh = innerHeight || dE.clientHeight || bod.clientHeight;
var wh
теперь содержит высоту окна без полосы прокрутки.