Quick & Tiny jQuery Drop Down Menus

Note: this has been superseded by the recursive drop down menu script.

The Code:

$(document).ready(function () { // Shawsons' Teeny-Tiny Drop Downs!
    $('.drop-down-menu li ul').hide().mouseleave(function () {
    $('.drop-down-menu>li>a').mouseenter(function () {
        $('ul', $(this).parent().parent()).hide();
        $('ul', $(this).parent()).show();
    }).mouseleave(function (o) {
        if ($(this).parent().has($(o.relatedTarget)).length < 1) {
            $('ul', $(this).parent()).hide();

The Markup:

<ul class="drop-down-menu">
        <li>Available Actions : </li>
        <li><a href="">Menu 1</a>
                <li><a href="a.htm">a</a></li>
                <li><a href="b.htm">b</a></li>
                <li><a href="c.htm">c</a></li>
        <li><a href="">Menu 2</a>
                <li><a href="d.htm">d</a></li>
                <li><a href="e.htm">e</a></li>
                <li><a href="f.htm">f</a></li>

Some CSS:

.drop-down-menu { display:block; }
.drop-down-menu li { float:left; padding: 8px; }
.drop-down-menu li a { padding:8px; }
.drop-down-menu li ul  
    border: 1px solid #999;
    border-radius: 0px 7px 7px 7px; -moz-border-radius:0px 7px 7px 7px; -webkit-border-radius:0px 7px 7px 7px;
.drop-down-menu li ul li { float:none; }
.drop-down-menu li ul li a { color:#000; }
.drop-down-menu li ul li:hover { background-color:#F68833; }
  1. No comments yet.
(will not be published)

I absolutely love these. They came at the lace wigs are good quality, and very soft. Absolutely love these extensions. I just love this hair. Hair came on time, I waited until after hair extensions uk very full, no shedding and it is been installed for 3 weeks now and yes I jus ordered 3 more bundles. Lol. I definitely recommend this company for your bundles ladies. They are soft, hair bundles on the head for human hair wigs and I would continue to recommend them. I have thinner hair so they cover and blend nicely.