hover事件优化(延时操作)

JQ的hover事件拓展

编写原因:当鼠标滑过某个带有hover事件的元素,但是仅仅是路过,并不是希望查看此部分内容的时候,效果不理想

$.fn.extend({
    delayed : function(fn1,fn2,time){
        time = time || 150
        var _this = this;
        
        _this.delayedTimer = null;
        return $(this).mouseenter(function(){
            clearTimeout(_this.delayedTimer);
            _this.delayedTimer = setTimeout(function (){
                fn1.call(_this);                
            },time)
        }).mouseleave(function(){
            clearTimeout(_this.delayedTimer);
            _this.delayedTimer = setTimeout(function (){
                fn2.call(_this);                
            },time)
        })
    }
})    

用法和hover基本一样,但是此方法目前无法针对多个元素,但是添加起来应该也不费劲

posted @ 2015-02-11 15:32  李清昌  阅读(242)  评论(0编辑  收藏  举报