Cannot overlay div if background color is transparent

Question

I am having an interesting problem. I want to have a box with a border overlaid on top of a vlc web player. I can get it to work just fine if the background color is not transparent, but as soon as I set it to transparent, it gets drawn behind the player. Does anyone know how to get around this?

Here is a jsfiddle that shows what I am talking about (You need to have vlc web plugin installed in order for this to work. Additionally, you can only do overlays with firefox, for some reason).

http://jsfiddle.net/AsGuL/21/

Answer 1

This post is old, but if someone with the same problem find it (like me), here is the solution:

VLC plugin have the attribute "windowless" you can use in this situation. Just add windowless="true" in the embed tag.

From the documentation:

windowless : (since VLC version 2.0.6) Draw the video on a window-less (non-accelerated) surface and allow styling (CSS overlay, 3D transformations, and much more). Default: false

https://wiki.videolan.org/Documentation:WebPlugin