I'm trying to embed a mp3 player into a sliding top panel (that can be opened and closed) made with jQuery. You can see here in action:
(it's in Spanish, so sorry if you feel uncomfortable surfing it)
The problem is that when you "close" the top panel, player stops. Except with IE (at least with IE8 ), where the player keep doing the job even once the top panel is collapsed.
Funny thing is: when you re-open the panel, the player remembers the position and starts playing from there.
The same happens if, for instance, I embed the player in the "Principal" ("Main" in English) section. When one changes to other section (tab) in the main horizontal nav bar, player also stops (again, except with IE).
I also tried non-flash-based players, like jPlayer (jQuery and HTML5 player) with exactly same results, so I don't think its a flash problem.
I guess it's a browser issue. Some of them (Firefox, Chrome and Opera mainly; didn't try Safari yet) stops "rendering" non-visible html portions (display:none;?) for performance optimization or something. Maybe the layout engines those browsers use (WebKit for Chrome, Gecko for Firefox, Presto for Opera) are the responsibles? I don't know.
Anyway, do you think there is any workaround for this behaviour? Any way to force that particular browsers rendering that particular portion of code?
BTW, if you detect any rendering error, I would appreciate if you tell me the error and your browser so I can fix it