Jump to content

Stop YouTube video when closing div


defroster

Recommended Posts

Hello, I am using a hide/show system which is displaying youtube videos. I would like the youtube video to STOP whenever the div is closed.

How do I do this?

Thanks for help.

 

Online demo: http://defroster.99k.org/layers.php

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Slide</title>
<style>

body{
font-family:Verdana, Geneva, sans-serif;
font-size:14px;}

#slidingDiv, #slidingDiv_2, #slidingDiv_3{
height:300px;
background-color: #99CCFF;
padding:20px;
margin-top:10px;
border-bottom:5px solid #3399FF;
display:none;
}



</style>


</head>

<body>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="incl/showHide.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){


   $('.show_hide').showHide({			 
	speed: 500,  // speed you want the toggle to happen	
	easing: '',  // the animation effect you want. Remove this line if you dont want an effect and if you haven't included jQuery UI
	changeText: 1, // if you dont want the button text to change, set this to 0
	showText: 'View',// the button text to show when a div is closed
	hideText: 'Close' // the button text to show when a div is open

}); 


});

</script>

<a href="#" class="show_hide" rel="#slidingDiv">View</a><br />
    <div id="slidingDiv">
    <iframe width="560" height="315" src="http://www.youtube.com/embed/w68qZ8JvBds" frameborder="0" allowfullscreen></iframe>
    
    </div>
    
    
    
<a href="#" class="show_hide" rel="#slidingDiv_2">View</a><br />
    <div id="slidingDiv_2">
    <iframe width="560" height="315" src="http://www.youtube.com/embed/B9tNGEt6rmE" frameborder="0" allowfullscreen></iframe>
    </div> 
    
  <a href="#" class="show_hide" rel="#slidingDiv_3">View</a><br />
    <div id="slidingDiv_3">
<iframe width="420" height="315" src="http://www.youtube.com/embed/eW5yWUKDMpg" frameborder="0" allowfullscreen></iframe>    </div>    

</div>


</body>
</html>

 

 

Link to comment
https://forums.phpfreaks.com/topic/265884-stop-youtube-video-when-closing-div/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.