开发者

jquery dropline to hold second when mouse is hover out

开发者 https://www.devze.com 2023-03-18 00:50 出处:网络
Is there a way to get this behavi开发者_运维百科or on this dropline menu?Need second or thrid level to stay active for one second when mouse is hover out from menu items.To clarify, you\'re looking fo

Is there a way to get this behavi开发者_运维百科or on this dropline menu?Need second or thrid level to stay active for one second when mouse is hover out from menu items.


To clarify, you're looking for some kind of delayed reaction to the mouse's movement? If so, check out this jQuery hoverintent plugin: http://cherne.net/brian/resources/jquery.hoverIntent.html

EDIT: I think you'll need to edit your menu script to replace any instance of .hover with .hoverIntent. I had trouble testing this in jsfiddle, but see if it works:

var droplinemenu={

arrowimage: {classname: 'downarrowclass', src:'http://www.odzaci.rs/wp-content/themes/typo/images/down.gif', leftpadding: 5}, //customize down arrow image
animateduration: {over: 200, out: 300}, //duration of slide in/ out animation, in milliseconds

buildmenu:function(menuid){
    jQuery(document).ready(function($){
        var $mainmenu=$("#"+menuid+">ul")
        var $headers=$mainmenu.find("ul").parent()
        $headers.each(function(i){
            var $curobj=$(this)
            var $subul=$(this).find('ul:eq(0)')
            this._dimensions={h:$curobj.find('a:eq(0)').outerHeight()}
            this.istopheader=$curobj.parents("ul").length==1? true : false
            if (!this.istopheader)
                $subul.css({left:0, top:this._dimensions.h})
            var $innerheader=$curobj.children('a').eq(0)
            $innerheader=($innerheader.children().eq(0).is('span'))? $innerheader.children().eq(0) : $innerheader //if header contains inner SPAN, use that
            $innerheader.append(
                '<img src="'+ droplinemenu.arrowimage.src
                +'" class="' + droplinemenu.arrowimage.classname
                + '" style="border:0; padding-left: '+droplinemenu.arrowimage.leftpadding+'px" />'
            )

            // THIS IS THE PART I REPLACED

            var config = {    
     over: function(e){
            var $targetul=$(this).children("ul:eq(0)")
            if ($targetul.queue().length<=1) //if 1 or less queued animations
                if (this.istopheader)
                    $targetul.css({left: $mainmenu.offset().left, top: $mainmenu.offset().top+this._dimensions.h})
                if (document.all && !window.XMLHttpRequest) //detect IE6 or less, fix issue with overflow
                    $mainmenu.find('ul').css({overflow: (this.istopheader)? 'hidden' : 'visible'})
                $targetul.slideDown(droplinemenu.animateduration.over)
        },
timeout: 1000, // number = milliseconds delay before onMouseOut    
out: function(e){
            var $targetul=$(this).children("ul:eq(0)")
            $targetul.slideUp(droplinemenu.animateduration.out)
        }
};

$curobj.hoverIntent( config );




        }) //end $headers.each()
        $mainmenu.find("ul").css({display:'none', visibility:'visible', width:$mainmenu.width()})
    }) //end document.ready
}
}
0

精彩评论

暂无评论...
验证码 换一张
取 消