Mega Dropdown-Menü onhover flackern

Question

Ich habe ein Problem mit einem Mega-Dropdown-Menü, das ich online gefunden habe. Es ist perfekt für meinen Zweck, aber es wirkt manchmal komisch und es hat ein flackerndes und blinkendes Problem. Der Link, wo ich ihn gefunden habe, ist hier: http://bootsnipp.com/snippets/featured/mega-menu-slide-down-on-hover-with-carousel. Der Autor kennt dieses Problem bereits, aber im Grunde könnte es gut für mobile funktionieren, wenn es sich verstecken wird. Auf Desktop-Version denke ich, ist eine wirklich gute Idee und ich verwende auf einer Website, die ich baue: http://napoleon.larchedigitalmedia.com/.

Das Problem, wie ich Ihnen sagte, bevor der flirking ist und ich denke, dass das Problem hier in jquery ist:

$(".dropdown").hover(   
    function() { 
     $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true,true).slideDown("400"); 
     $(this).toggleClass('open');   
    }, 
    function() { 
     $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true,true).slideUp("400"); 
     $(this).toggleClass('open');  
    }); 

Ich verstehe nicht, wenn es sich um eine Bootstrap-Problem (Bootstrap Verwendung meist ein Onclick-Ereignis ist für das Mega-Drop-Down-Menü) oder das Problem ist in diesem Snippet. Im Wesentlichen wird die Klasse open (toggle) zu schnell zu einem div hinzugefügt und manchmal wird sie gleichzeitig auf zwei divs angewendet. Könnte mir jemand helfen, dieses Problem zu beheben?

Answer 1

Soweit ich sehen kann, hat die Animation in Ihrem Projekt keine Zeit zu beenden und JS versucht beide zur gleichen Zeit zu animieren. Ich habe gerade ein wenig Code geändert und das Flackern hört auf.

$(".dropdown").hover(   
function() { 
    $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true,false).slideDown("400"); 
    $(this).toggleClass('open');   
}, 
function() { 
    $('.dropdown-menu', this).not('.in .dropdown-menu').stop(true,false).slideUp("400"); 
    $(this).toggleClass('open');  
}); 

Gerade durch den zweiten Parameter der stop() Funktion ändert, führt die Animation selbst. Wenn Sie mehr Informationen wünschen, gibt es immer die Jquery documentation auf der Funktion.