jquery ile hoverintent kullanarak yapabilirsiniz.
hoverintent plugini ile (
http://cherne.net/brian/resources/jq...verIntent.html ) şu kodları kullanırsanız düzgün olacaktır:
(function(a){a.fn.hoverIntent=function(k,j){var l={sensitivity:7,interval:100,timeout:0};l=a.extend(l,j?{over:k,out:j}:k);var n,m,h,d;var e=function(f){n=f.pageX;m=f.pageY};var c=function(g,f){f.hoverIntent_t=clearTimeout(f.hoverIntent_t);if((Math.abs(h-n)+Math.abs(d-m))<l.sensitivity){a(f).die({mousemove:function(o){e(o)}});f.hoverIntent_s=1;return l.over.apply(f,[g])}else{h=n;d=m;f.hoverIntent_t=setTimeout(function(){c(g,f)},l.interval)}};var i=function(g,f){f.hoverIntent_t=clearTimeout(f.hoverIntent_t);f.hoverIntent_s=0;return l.out.apply(f,[g])};var b=function(o,f){var g=jQuery.extend({},o);if(f.hoverIntent_t){f.hoverIntent_t=clearTimeout(f.hoverIntent_t)}if(o.type=="mouseenter"){h=g.pageX;d=g.pageY;a(f).live("mousemove",function(p){e(p)});if(f.hoverIntent_s!=1){f.hoverIntent_t=setTimeout(function(){c(g,f)},l.interval)}}else{a(f).die("mousemove",function(p){e(p)});if(f.hoverIntent_s==1){f.hoverIntent_t=setTimeout(function(){i(g,f)},l.timeout)}}};return this.live({mouseenter:function(f){b(f,this)},mouseleave:function(f){b(f,this)}})}})(jQuery);
$(document).ready(function(){
$(".header>nav>ul>li").hoverIntent({sensitivity: 3,interval: 150,timeout: 150,
over: function(){
$('ul',this).slideDown(200);
},
out: function(){
$('ul',this).slideUp(200);
}
});
});(alt menü olan ul'yi display:none yapın, pozisyonunu direk görünecek şekilde ayarlayın ve bu kodları script kısmına yapıştırın, olacaktır, bu arada yukarıdaki koda hoverintent plugini dahildir.)