jquery ie6 issue swaping videos through hide/show while playing.

Question

So my code is:

Click the link show the div.

I'm using the jquery flash embed object.

     $(document).ready( function() {
      $('a.overview').click( function() {
        $('#overview').show(); // show div.contact
        $('#evaulting').hide(); // hide div.contact
        $('#his').hide(); // hide div.contact
      });
    });

$(document).ready( function() {
  $('a.evaulting').click( function() {
    $('#evaulting').show(); // show div.contact
    $('#overview').hide(); // hide div.contact
    $('#his').hide(); // hide div.contact
  });
});


    <div id="overview" style="display:none">
    <ul>
        <li rel="play-norelated.swf:680:480:true:ffffff" class="flash-replaced">
            <embed width="680" height="480" type="application/x-shockwave-flash" src="play-norelated.swf" pluginspage="http://www.adobe.com/go/getflashplayer" flashvars="playVideo=ent_web_480x" bgcolor="ffffff" />
            <div class="alt"><h1>To Play Iron Mountain Videos - You will need to upgrade your Flash Player</h1>
            <p><a href="http://www.adobe.com/go/getflashplayer"&gt;&lt;img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p></div>
        </li>
    </ul>
        </div>


    <div id="evaulting" style="display:none">
    <ul>
        <li rel="play-norelated.swf:680:480:true:ffffff" class="flash-replaced">
            <embed width="680" height="480" type="application/x-shockwave-flash" src="play-norelated.swf" pluginspage="http://www.adobe.com/go/getflashplayer" flashvars="playVideo=evaulting_web_480x" bgcolor="ffffff" />
            <div class="alt"><h1>To Play Iron Mountain Video's - You will need to upgrade your Flash Player</h1>
            <p><a href="http://www.adobe.com/go/getflashplayer"&gt;&lt;img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p></div>
        </li>
    </ul>
    </div>

When I repeat this code and get the second video to load on click. It works in all browsers. The only issue I'm running into is that in IE6 the video keeps playing and in other browsers it stops the video your watching and loads the one you clicked on.

I looked into using the .remove object or the .append to a div, but I can't seem to get that to work and if it does work will it play nice with IE6.

Try it out and maybe solve my issues.

Answer 1

Removing the object should work, I've had this issue with a lot of my project and it always works.

$("object").remove();

Why are you not using SWFObject to embed?