web-dev-qa-db-fra.com

Comment faire d'une vidéo intégrée YouTube une page de largeur complète?

Voici le violon au code: http://jsfiddle.net/dLPa8/

Si vous faites défiler l'écran, une vidéo est intégrée à partir de YouTube. Ce dont j'ai besoin, il devrait couvrir toute la hauteur et la largeur de la page. Je veux dire que cela devrait ressembler un peu à la première section (dans le violon). 

J'ai essayé ceci:

<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>

Cela a résolu le problème dans une certaine mesure, mais la vidéo s’accroche en haut de la page en utilisant la variable iframe ci-dessus. Comment faire en sorte que la section vidéo atteigne la hauteur de la page entière?

htmlcssyoutube
13
Ranveer

Voici un VIOLON

<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' });
  });
});
27
mdesdev

Essayez d’utiliser innerHeight ou .clientHeight:

var doc = document, bod = doc.body, dE = doc.documentElement;
var wh = innerHeight || dE.clientHeight || bod.clientHeight;

var wh contient maintenant la hauteur de la fenêtre, sans barre de défilement.

0
PHPglue