1. Add Vimeo iframe
1 |
<iframe id="vimPlayer" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> |
2. Load Froogaloop and add some Javascript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
var vimID = ""; var playerID = "vimPlayer"; $("#vimPlayer").attr("src", "//player.vimeo.com/video/"+vimID+"?api=1&title=0&byline=0&portrait=0&color=f00010&player_id="+playerID); Froogaloop(jQuery('#'+playerID)[0]).addEvent('ready', ready); function ready(playerID){ Froogaloop(playerID).addEvent('play', play(playerID)); Froogaloop(playerID).addEvent('seek', seek); Froogaloop(playerID).api('play'); } function play(playerID){ alert(playerID + " is playing"); } function seek() { alert('Seeking'); } |
This will add a READY event for the player, which allows you to handle other stuff within that function from that point on. Like making the video responsive using fitVid for example :)
Its important that you reference the playerID in the actual iframe source or the ready function will never fire !