Question

I jave a strange issue, I’am using the mediaelement js media player to serve up video from youtube videos.

The thing is I’am using it on one site where it works great in all browsers. I have literally copied the code for use on another site and its not working properly in FF & IE.

It throws this error in the console

this.pluginApi.playMedia() is not a function

Both sites are on the same server, all the same js,css files are in the same order, player instances initialized in the same place etc..

Im also getting 2 sets of controls showing up! In Chrome, this doesnt happen if you refresh, only happens in safari if web inspector is open, only 1 set of controls in IE.

anyone had similar issues?
heres some code im using

<video id="video_player" width="480" height="300" controls="controls"         preload="none">
<source type="video/flv" src="http://www.youtube.com/v/<? echo $row['youtubeid']; ?>" />
<object width="480" height="300" type="application/x-shockwave-flash" data="flashmediaelement.swf">
    <param name="movie" value="flashmediaelement.swf" /> 
    <param name="flashvars" value="controls=true&amp;poster=myvideo.jpg&amp;file=myvideo.mp4" />
</object>

I have tried all this with setting the paths in the object params to the YT files too, no dice.

Answer 1

Just in case anybody else comes across this issue…

It turns out some scripts we were using – cbb by Roger Johansson – http://www.456bereastreet.com/
was conflicting with our video player. Maybe this has something to do with the fact that mediaelement was creating elements inside elements that were being created by the cbb script.

Anyway, we fixed it by using a separate page to pull in the video and then we called that through to our video page with an iframe. Working fine now