Floating CSS menu on YouTube Flash Videos

I currently involve in a project that put videos as its primary contents. My involvement is not primary on the . I'm just helping a little. What I like from the process is to find solution. One of the problem is on the navigation menu. It's very common to have navigation with sub-menus. Without having special objects like , everything should be under control. But, not this time.

The problem

When embedding a video from YouTube (in this case, using the iframe method), the navigation is broken because it sits behind the . The same result with the old embed code. See the below:

It's wrong. The menu should be displayed above the video. It should be like the below:

So, is there a simple way to fix this problem? Yes.

The solution

The solution is pretty easy. You only need to add a parameter for the embed code. It's wmode=transparent. I will use an example here. This is an embed code from Serabi Solo video at YouTube:

The code above should me modified by adding wmode=transparent parameter. The final code will be like this:

It's easy, right? But, what if you want to use the old embed code? You can fix the problem using a same method. For example, this is 's old embed code from the same video:

You need to add a parameter. Just add .
The final code will be like this:

Have !

3 replies on “Floating CSS menu on YouTube Flash Videos”