Optimizing a jQuery drop-down menu function

Question

Here's the function, which I am calling like this: $(document).ready(function(){ dropdownmenu(); });

function dropdownmenu() {   
    $("#navigation ul li.upper").hover(function(){
        $("ul.submenu", this).show(400);
    },function(){
        $("ul.submenu", this).hide();
    }); 
}

How can I optimize this function, specifically preventing animation queuing and making it fire properly on page load? Any other tips would ask be welcome!

Last, but not least, the markup:

    <ul>
        <li>...</li>
        <li class="upper">
            <a href="#">Example</a>
            <ul class="submenu">
                <li><a href="#">Sub-example</a></li>    
            </ul>
        </li>
        <li>...</li>

Thanks in advance!

Answer 1

All the work has already been done for you.

Check out superfish

If you still want to roll your own then at least check the source on this plugin and also Hover with intent