I have implemented a flowplayer plugin into my website, with playlist and control plugins.
While the player goes through different statuses (loading movie, playing, pausing) it should dynamically set classes to the DOM object it is currently working on (usually an <a> element.
This works fine as long as the player is loading a movie (class="progress"), so this status can be made visible via a certain set of CSS (red border for now).
After the movie is loaded and started to be played, the player should remove class="progress" which it does, and replace it by class="playing" – and here I fail despite countless efforts.
For movies currently being played or paused, the class of the underlying <a> element is not set to class="playing" or class="paused" and the CSS sets pertaining to these statuses are not displayed (green and cyan borders for the sake of testing).
I tried to implement flowplayer’s manual playlist demo page which works fine when called from flowplayer’s server (despite the fact that – viewing the html source – I observe missing all header tags and opening body tag), but shows the same described behaviour in my development (XP, netbeans) and live (service provider) environments – I just can’t get this feature to work in Google Chrome, IE7 or IE8.
Anyone had this behaviour before and can give me some guidance?
The flowplayer playlist plugin uses an attribute selector
$("[href="+url+"]");however it doesn’t put the value in quotes, as is required. I toyed around with jsfiddle and this is apparently valid in jQuery 1.4.x, but fails in jQuery 1.5. Your site is using the latter, but the flowplayer demo site is using 1.4.2. Could you try rolling back the jQuery version and seeing if that makes a difference? Obviously the optimal solution would be to correct the bug in the playlist plugin.