Hide videos in iframe safari [closed]

-1

I have a YouTube iframe video inside a div and when I hide in the div on the safari, the video continues to appear. How can I resolve this? It also happens to me that the video continues to play when I hide the div, how can I stop the video?

    
asked by anonymous 20.05.2016 / 11:22

2 answers

1

This is the way I usually do and it has never given me any problems.

function toggleVideo(state) {
    var div = document.getElementById("vid");
    var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
    div.style.display = state == 'hide' ? 'none' : '';
    func = state == 'hide' ? 'pauseVideo' : 'playVideo';
    iframe.postMessage('{"event":"command","func":"' + func + '","args":""}','*');
}
<p><a href="javascript:;" onClick="toggleVideo();">Ver</a> </p>


<div id="vid" style="position:absolute;display:none;">
  
   <iframe width="500" height="315" src="https://www.youtube.com/embed/fwVUO_Nk0oE"frameborder="0" allowfullscreen></iframe>
  
   <br /><br />
   <a href="javascript:;" onClick="toggleVideo('hide');">Esconde</a>
  </div>
    
20.05.2016 / 12:45
1

Strange, I do not know what the structure of your html is but try to do it:

<div class="my_vid">
   <iframe....></iframe>
</div>

CSS:

.my_vid {
   width:600px;
   display: none;
   height:400px;
}

.my_vid iframe {
   height:100%;
   width:100%;
   display: block;
}

if it does not work. add to .my_div , this is just a desrrasque:

overflow:hidden;
height:0;
    
20.05.2016 / 11:48