CSS Hide Youtube Video ne fonctionne pas dans IE

Question

J'ai une vidéo youtube comme ça...

<object id="video_1" class="a_video .......

Cependant le css pour a_video :

display:none;

Il ne le cache pas dans IE.

Quelqu'un sait-il comment masquer les vidéos youtube intégrées dans IE ?

Answer 1

Si je me souviens bien, j'ai aussi eu ce problème auparavant. Ma vidéo s'arrêtait de s'afficher, mais je pouvais l'entendre continuer à jouer en arrière-plan. La solution que j'ai utilisée a été de le supprimer complètement et de le remettre en place au besoin.

Comme ça :

(function($){
  $(function(){
    var videoCode = $('object').parent().html();
    $('#toggleButton').bind('click',function(e){
      if($('object').length) {
       $('object').remove(); 
      } else {
       $("#container").append(videoCode); 
      }
    });
  });
})(jQuery);​

Cette fonction fait plusieurs choses... tout d'abord, elle place le code HTML associé à la vidéo (l'objet) dans une variable afin de s'en souvenir. Ensuite, elle donne à un bouton la possibilité d'afficher ou de masquer la vidéo (je suppose que c'est le comportement souhaité). Ainsi, lorsque le bouton est cliqué, il vérifie si une vidéo est actuellement dans la page, si c'est le cas, il la supprime du DOM, et si ce n'est pas le cas, il prend le HTML stocké et le réapplique au conteneur de la vidéo.

Voici le HTML qui va avec :

  <div id="container">
    <object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/hQVTIJBZook&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/hQVTIJBZook&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
  </div>
  <a href="#" id="toggleButton">Toggle Video</a>

Answer 2

J'ai vu ce bug dans IE8. Si vous pointez overflow : hidden sur les éléments du bloc qui ont des problèmes, cela devrait faire l'affaire. Vous devrez peut-être mettre le code d'intégration de Youtube dans quelque chose.