Best jQuery drop-down nav Suckerfish alternative that works with Flash?

Question

I think that my Suckerfish drop-down navigation does not play well with flash. I've done everything I can think of, yet my drop-down navigation keeps displaying underneath my flash movie. If I replace the movie with an image, it displays just fine. Only when I use a flash movie does the navigation display underneath the flash movie. I have already added wmode and it still does not work:

<param name="wmode" value="transparent" />

So I think my only solution left is to try and replace the navigation. So I am looking for a jQuery plugin that will replace my current navigation. My current navigation works like this:

1. It's a horizontal drop-down menu
2. When you hover over the menu, the first level drop-down menu appears
3. When you click on a link in the first level drop-down menu, a second level is revealed below the link that was clicked (not the right like most nav menus). Sort of like a vertical accordion menu.

Is there anything like this currently available? I can't think of anything else to try to make the nav appear on top of the flash movie.

Answer 1

bah! I was forgetting one thing. You must set the window mode in TWO places! I am using the SWFObject javascript plugin, so my HTML looks like the following.

In order for your navigation to appear on top of your flash movie, you must not forget to specify wmode="opaque" (or transparent) in the second object tag

<object id="homepage_slideshow" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="530" height="397">
    <param name="movie" value="flash/homepage_slideshow.swf" />
    <param name="wmode" value="opaque" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="flash/homepage_slideshow.swf" width="530" height="397" wmode="opaque">
    <!--<![endif]-->
    <!-- begin alternative content -->
    <img src="images/photos/homepage-placeholder-photo.jpg" width="530" height="397" alt="Get Moving Again!" />
    <!-- end alternative content -->
    <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
</object>