Can jQuery listen to a click event on a youtube / vimeo movie?

Question

I have a jQuery slider filled with movies and I would like jQuery to stop the slider on a click event for either the embed / object. I have tried to no avail to get this to work. I have tried this:

$("embed").click(function() {
alert('Handler for .click() called.');   
})

$("object").click(function() {
alert('Handler for .click() called.');   
})

Neither works for the HTML tags embed or object. Any suggestions?

Answer 1

Have you tried adding a function name into the onclick attribute of the object tag? If that does not work then I'm guessing the object itself is consuming the event and there is no way to get to the click.

Answer 2

Enable the youtube player like so:

http://www.youtube.com/v/VIDEO_ID?enablejsapi=1&version=3

Then you can use these operations and listen to and react to events such as "onStateChange"

Answer 3

Because both youtube and vimeo videos are rendered using flash, it's unlikely that you'll be able to listen for the click events registered by those elements because Flash has its own internal event model with its own handlers. I imagine it's possible to rebroadcast click events to javascript using ExternalInterface, but I've never seen it done.

Answer 4

Could it be that the jQuery bindings do not work because your embed/object elements are generated after you do that bindings? For example if you are using swfobject (flash gets embedded by javascript) this could be an issue.

What happens if you use live() instead?

jQuery("object,embed").live("click", function() {
    alert('Handler for .click() called.');  
});

You could also try wrapping a div around these videos and bind the handler to the div.