Stop video from playing when new tab is clicked

[CamA2007]

Hi,
I have a page with tabs and on each tab there is a video (FLV). I'd like the videos to stop playing when a user clicks on a tab.

This functions perfectly in Chrome. In Firefox and Safari the videos continue to play when a user clicks another tab. And in IE the FLV controls only appear on the video on tab 1, so I can't even play the other videos.

I'd like to know how I can stop the videos when a new tab is clicked in Firefox and Safari. And how can I make the FLV controls appear for all videos in IE?

Any help would be greatly appreciated! Thank you and happy New Year!

My code:

<div id="tabs">

<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 3</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 4</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 5</li>
</ul>

<div class="TabbedPanelsContentGroup">

<div class="TabbedPanelsContent">

<div class="media_content">

<div class="media_left" id="Tab1">


<div class="clear"></div>

</div><!-- end media_left -->

<div class="media_right">

</div><!-- end media right -->

</div><!-- end media_content -->

</div><!-- end Tab -->

<div class="TabbedPanelsContent">

<div class="media_content">

<div class="media_left" id="Tab2">


<div class="clear"></div>

</div><!-- end media_left -->

<div class="media_right">

</div><!-- end media right -->

</div><!-- end media_content -->

</div><!-- end Tab -->




<div class="TabbedPanelsContent">

<div class="media_content">

<div class="media_left" id="Tab3">


<div class="clear"></div>

</div><!-- end media_left -->

<div class="media_right">

</div><!-- end media right -->

</div><!-- end media_content -->

</div><!-- end Tab -->




<div class="TabbedPanelsContent">

<div class="media_content">

<div class="media_left" id="Tab4">


<div class="clear"></div>

</div><!-- end media_left -->

<div class="media_right">

</div><!-- end media right -->

</div><!-- end media_content -->

</div><!-- end Tab -->

<div class="TabbedPanelsContent">

<div class="media_content">

<div class="media_left" id="Tab5">


<div class="clear"></div>

</div><!-- end media_left -->

<div class="media_right">

</div><!-- end media right -->

</div><!-- end media_content -->

</div><!-- end Tab -->

</div><!-- end TabbedPanels1 -->

</div><!-- end tabs -->


<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab:0});
</script>


<script>
//loadOverLay();




function createVideoTag(mName, elementName){

var moviename ='/subs/podcasts/'+mName;
var isiPad = navigator.userAgent.toLowerCase().indexOf("ipad")> -1;
var vplayer = '';
if (isiPad) {


vplayer = '<video width="380" height="240" controls="controls" id="movie">'+
' <source src="'+moviename+'.mp4" type="video/mp4" />'+
' </video>';

}else{


vplayer = '<object type="application/x-shockwave-flash" data="/subs/podcasts/player_flv_maxi.swf" width="380" height="240" id="flvPlayer">'+
'<param name="movie" value="/subs/podcasts/player_flv_maxi.swf" />'+
'<param name="allowFullScreen" value="true" />'+
'<param name="FlashVars" value="flv='+moviename+'.flv&autoplay=0&showtime=1&showfullscreen=1&width=380&height=240&showstop=1& showvolume=1&title=Play&bgcolor1=7F7F7F&bgcolor2=7F7F7F&playercolor=7F7F7F&buttoncolor=444&buttonove rcolor=444&slidercolor1=444&slidercolor2=444&sliderovercolor=444&loadingcolor=7F7F7F&titlesize=40&sh owtitleandstartimage=0&buffer=0" />'+
'<embed class="ieplayer" src="/subs/podcasts/player_flv_maxi.swf?movie='+moviename+'.flv&autoplay=0&showtime=1&showfullscreen=1&width=380&height= 240&showstop=1&showvolume=1&title=Play&bgcolor1=7F7F7F&bgcolor2=7F7F7F&playercolor=7F7F7F&buttoncolo r=444&buttonovercolor=444&slidercolor1=444&slidercolor2=444&sliderovercolor=444&loadingcolor=7F7F7F& titlesize=40&showtitleandstartimage=0&buffer=0" />'+
'</object>';


}

if(document.getElementById(elementName)){
document.getElementById(elementName).innerHTML = '';
document.getElementById(elementName).innerHTML = vplayer;
}
}

createVideoTag('video1','Tab1');
createVideoTag('video2','Tab2');
createVideoTag('video3','Tab3');
createVideoTag('video4','Tab4');
createVideoTag('video5','Tab5');



</script>

[CamA2007]

Hoping someone might be able to help with this. Having absolutely no luck with any browser other than Google Chrome :/