Question

I have jQuery on my site. I also have a youtube video using a standard object/embed code. How would I use jQuery so that when the youtube video finishes playing, the page is redirected to a new page?

** EDIT *

This is my youtube embed:

<div id="embed_player">
    <object id="embed_object" type="application/x-shockwave-flash" width="640" height="385" data="http://www.youtube.com/v/LgJxPKfV8sw">
        <param name="movie" value="http://www.youtube.com/v/LgJxPKfV8sw">
        <param name="allowfullscreen" value="true">
        <param name="allowscriptaccess" value="true">
        <param name="wmode" value="transparent">
        <param name="flashvars" value="autoplay=0&hd=1&fs=1&rel=0&version=3&enablejsapi=1&playerapiid=ytplayer">
    </object>
</div>

I have tried adding the following javascript to my page, but with no success…

<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
<script type="text/javascript">
function onYouTubePlayerReady(playerId) {
  ytplayer = document.getElementById("ytplayer");
  ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}

function onytplayerStateChange(newState) {
   alert("Player's new state: " + newState);
}
</script>

Answer 1

You need to bind to the onstatechange event:

onStateChange
This event is fired whenever the player’s state changes. Possible values are unstarted (-1), ended (0), playing (1), paused (2), buffering (3), video cued (5). When the SWF is first loaded it will broadcast an unstarted (-1) event. When the video is cued and ready to play it will broadcast a video cued event (5).

Some good documentation here: https://developers.google.com/youtube/js_api_reference#Adding_event_listener