EE hoverIntent

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27436413.html#a37103897

by rjurd

HTML

<script src="http://cherne.net/brian/resources/jquery.hoverIntent.js"></script>
<ul id='nav'>
    <li></li>
</ul>

JavaScript

var $j = jQuery.noConflict();



function buildSub(name, offset) {
    var list = $j(name).find("ul").text();
    if (list.length > 0) {
        list = '<div class="nav"><ul>' + $j(name).find("ul").html() + '</ul></div>';
    } else {
        list = '';
    }

    var content = $j('.na-' + name.substring(1)).html();
    var sub = '<div id="nav-1" class="sub">' + list + '</div>';
    $j(name).append(sub);
    $j(name + ' .sub').attr('id', name.substring(1));
    $j(name + ' .sub').css('left', offset + 'px');
}

function showSub() {
    $j(this).find(".sub").slideDown();
}

function hideSub() {
    $j(this).find(".sub").slideUp();
}

function clearText(field) {

    if (field.defaultValue == field.value) { field.value = ''; }
    else if (field.value === '') { field.value = field.defaultValue; }

}

jQuery(document).ready(function($) {
    var config = {
        over: showSub,
        // function = onMouseOver callback (REQUIRED)    
        timeout: 500,
        // number = milliseconds delay before onMouseOut    
        out: hideSub // function = onMouseOut callback (REQUIRED)    
    };

    buildSub('.nav-1', 0);
    buildSub('.nav-3', -138);

    $('#nav li .sub .nav ul').show();


    //$j(".nav-2 .sub").show(); 
    $('#nav li').hoverIntent(config);
});