Flowplayer Overlay

DescriptionjQuery snippet by - 09/11/10

IE renders embeded files differently than most browsers. When using flowplayer within a jquery tools overlay, IE will continue playing the video when you close the lightbox type window, it is just hidden. The issue is that you can still hear the audio even after closing the overlay window containing the flashplayer.

Most of the other browsers, like firefox stop the flash from playing when it is hidden, like when you close the lightbox. So there is no problem, when you open up the video again it starts over. But Not IE, just use this snippet, the key to it working is the player.pause() method call.

Note: This code is for jQuery/flowplayer/jquery tools overlay

Tags ,

<a
href="http://TYPETHEVIDEOURLHERE"
style="display:block;width:500px;height:400px"
id="player">
</a>

<script type="text/javascript">

//Create Player and Overlay
jQuery(function() {

//Player
var player = $f("player", "/flowplayer/flowplayer-3.2.4.swf", {
clip: {
autoPlay: true,
autoBuffering: true,

//Close overlay when play complete
onFinish: function() {
jQuery('.close').click();
}
}
});

//Overlay
jQuery("img[rel]").overlay({

top: "center",

onClose: function() {
player.pause();
}
});

});
</script>
  • Share
Authored by: Adam J Nowak
http://hyperspatial.com

Comments and Feedback