JS----hover时间延迟设置

先引入jquery包

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

hoverDalay  延迟时间设置

(function(a) {
    a.fn.hoverDelay = function(c, f, g, b) {
        var g = g || 200,   //hover entry time
        b = b || 200,       //hover departure time
        f = f || c;
        var e = [],
        d = [];
        return this.each(function(h) {
            a(this).mouseenter(function() {
                var i = this;
                clearTimeout(d[h]);
                e[h] = setTimeout(function() {
                    c.apply(i)
                },
                g)
            }).mouseleave(function() {
                var i = this;
                clearTimeout(e[h]);
                d[h] = setTimeout(function() {
                    f.apply(i)
                },
                b)
            })
        })
    }
})(jQuery);

操作对象

$(function() {
$(".wrap h3").hoverDelay(function() {
        $(this).css("color","red");
    },
    function() {
         $(this).css("color","blue");
    });
	
$(".box").hoverDelay(function() {
        $(this).find(".popup").show();
    },
    function() {
        $(this).find(".popup").hide();
    });
});

HTML:

<div class="wrap">
	<h3>H3</h3>
</div>

<div class="box">
	<div class="show">
		<div class="popup" style="display:none">popup</div>
    </div>
</div>