Floating CSS menu on YouTube Flash Videos

I currently involve in a website project that put videos as its primary contents. My involvement is not primary on the design. 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 flash, 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 video. The same result with the old embed code. See the screenshot below:

It's wrong. The menu should be displayed above the video. It should be like the image 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 YouTube's old embed code from the same video:

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

Have fun!