views:

23

answers:

0

Hi guys,

I'm building a website using YouTube's chromeless player, but I'm facing an IE bug. I put a mask on the video as the client wanted it to be a hand drawn TV, so right now I have a transparent PNG sitting on top of the actual flash object so I'm able to see the video but with a nice frame around it. I also managed to put a play button, timer and a progress bar as well as volume control and volume slider, but I still have a problem.

YouTube's chromeless player still renders the big play button in the middle, but having a transparent PNG on top, I can't really click that button. I found a workaround by placing a transparent (no background) link on top of it, which is absolutely positioned, and I'm hiding that when the video starts playing. Can't really notice there's something going on there. Still, on IE, the link isn't clickable, altough it's on top and positioned absolutely. Weird thing is that the small play/pause control that I have at the bottom of the player on the flash object as well works like a charm.

I did some testing and it looks like IE won't make the link clickable if it's not visible (it's there, display: block;, but doesn't have a background). I would be gratefull if I could keep the link without a background and have it work in IE, even if it's a jQuery solution...

EDIT

Temporary solution is setting opacity:0.1; and filter:alpha(opacity=1); I can only imagine that IE consideres a transparent link being a risk in security or something. Still, I wish I could find a better way to handle this...