I have an application in which i am embading youtube video using < object > code. Just before this video i have menubar created via css. In this menu i have multiple choices like if i have main item "Products" and when user mouse over on the Products new items will display like "Product 1","Product 2" etc... Now problem is that if i have multiple products then my list view will be long and as just below of menu i have placed you tube video, my menu items are opening behind the video. So i am not able to see or select those items. Is there any way so that when user mouse over to menu, video automatically float to downwards...??? i am posting my code to understand properly.
<ul>
<li class='active '><a href='index.html'><span>Home</span></a></li>
<li><a href='#'><span>Products</span></a>
<ul>
<li><a href='#'><span>Product 1</span></a></li>
<li><a href='#'><span>Product 2</span></a></li>
<li><a href='#'> <span>Product 3</span></a></li>
<li><a href='#'><span>Product 4</span></a></li>
</ul>
</li>
<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/w_vw7Cm-0g4" />
<param name="allowFullScreen" value="true" />
<param name="allowscriptaccess" value="always" />
<embed src="http://www.youtube.com/v/YBMjhsfi3qw" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344">
</embed></object>
This will hide menu under video.
Please Help me out... Thanks in advance...