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

Posted by user217181 on Stack Overflow See other posts from Stack Overflow or by user217181
Published on 2009-11-23T17:28:36Z Indexed on 2010/04/03 0:13 UTC
Read the original article Hit count: 280

Filed under:
|
|
|
|

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"><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"><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.

© Stack Overflow or respective owner

Related posts about ie6

Related posts about jQuery