All posts in jQuery

$(document).ready(function(){

    $('#navigation li').hover( function()
    {
        $(this).children('ul').not(':animated').slideDown('#navigation li ul');
    }, function()
    {
        $(this).children('ul').slideUp('#navigation li ul');
    });
   
});

<ul id="navigation">
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a>
       
            <ul>
                <li><a href="#">About us</a></li>
                <li><a href="#">More info about</a></li>
                <li><a href="#">Even more info</a></li>
            </ul>
       
        </li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Contact</a></li>

    </ul>

#navigation {position: relative;float: left;display: inline;}
#navigation li {position: relative;float: left;display: inline;}
#navigation li a {float: left;display: inline;text-decoration: none;color: blue;padding: 4px 10px 4px 10px;}

#navigation li ul {position: absolute;top: 26px;left: 0px;margin: 0;padding: 0;background: #cccccc;display: none;width: 180px;}
#navigation li ul li {float: left;width: 100%;margin: 0;padding: 0;border-bottom: 1px dotted #959595;   }
#navigation li ul li  a {float: left;width: 100%}

// load all the libraries
// i like to put them in a folder called "public" then "js"
<link rel="stylesheet" type="text/css" href="public/js/fancybox/jquery.fancybox-1.3.1.css" media="screen" />
<script type="text/javascript" src="public/js/jquery.min.js"></script>
<script type="text/javascript" src="public/js/fancybox/jquery.mousewheel-3.0.2.pack.js"></script>
<script type="text/javascript" src="public/js/fancybox/jquery.fancybox-1.3.1.js"></script>
<script type="text/javascript" src="public/js/jquery.cookie.js"></script>

$(document).ready(function(){

/**
      *  MODAL BOX
      */
    // if the requested cookie does not have the value I am looking for show the modal box
    if($.cookie("modal") != 'true')
    {
        var _message_to_show = '<h2>Hi!</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis mi eu elit tempor facilisis id et neque</p> <br /><br /><a href="#" id="modal_close">ENTER</a> <a href="http://www.google.com" id="modal_exit">EXIT</a><br /><br />';
       
        // on page load show the modal box
        // more info about the options you can find on the fancybox site
        $.fancybox(
            _message_to_show,
            {
                'width'             : 350,
                'height'            : 300,
                'transitionIn'      : 'none',
                'transitionOut'     : 'elastic',
                'centerOnScroll'    : 'true',
                'overlayOpacity'    : 0.9,
                'overlayColor'      : '#000',
                'modal'             : 'true'
            }
        );
       
        // in the message is a link with the id "modal_close"
        // when you click on that link the modal will close and the cookie is set to "true"
        // path "/" means it's active for the entire root site.. if you set it to "/admin" will be active on the "admin" folder
        // expires in 7 days
        // "modal" is the name i gave the cookie.. you can name it anything you want
        $('#modal_close').live('click', function(e) {
            e.preventDefault();
            $.cookie("modal", "true", { path: '/', expires: 7 });    
            $.fancybox.close()
        });
    }    
   
});