I have recently stumbled into a problem with a media section of a site I am working on where users can view video clips. As is the norm now-days, I am using an flv that progressively downloads from my web server to the client. The area is pretty much like a YouTube section of the site where the user picks or searches from a database of video clips, then upon choosing their clip views this on another page.
The problem reared its ugly head because unlike youtube, this site used a menu that drops down over the flash video.
This is easily curable using the wmode=transparent parameter that allows elements to be displayed over the flash object.
<param name=”wmode” value=”transparent”> – to be added to the OBJECT tag
wmode=”transparent” – to be added to the EMBED tag
However, my issue came with also wanting the user to be able to display the video in full screen. At first I thought it was just a case of using a skin with the full screen option. But upon reading further I found I also needed the “allowfullscreen” parameter set to true.
Again, not a problem, once it was set it worked like a dream… until I set both wmode and allowfullscreen. That’s when things fell over.
This is down to the software scaling which allowfullscreen uses to take over the users monitor.
I had a few options…
- Force users to upgrade their flash player as this problem is allegedly fixed in the very latest flash player – According to our stats this would impact on a lot of users, I always like to design to accommodate the highest percentage of users.
- Change the menu – Menus should always be consistent across any website… so not an option
- Open a new kiosk style media player…
Although it wasn’t a perfect solution, opening up a new media player would allow the full screen and provide another opportunity to display more information related to the video to the user. Therefore this is what I opted for.
The final obstacle was stopping the current video (if playing) when the user pops up the media player.
I found http://www.permadi.com/tutorial/flashjscommand/ – very useful.
So, there we go. For the time being that’s my solution. Still not perfect though, so I will keep an eye on my stats to see when the majority of users have the latest flash player installed.