元素懸停slideToggle只在Firefox中出怪物

Question

此問題只出現在Firefox中。

我試圖做最小化我的代碼儘可能： JSFiddle Example

我有一個菜單，這是對顯示頁面的底部：無。上面是我的Button來調用slideToggle函數。你能否將這個按鈕在Firefox中懸停幾下，看看我的意思。有時我的菜單會滑落並立即滑動，儘管光標仍在菜單div內。通過將光標移動到文本「菜單」下，當您懸停菜單按鈕時，通常會出現此問題。

HTML

<div id="menuBtnFake">Menü</div> 

<div id="menu"> 

    <div id="menuBtn">Menü</div> 

    <ul> 
     <li><a href="#">Link 1</a></li> 
     <li><a href="#">Link 2</a></li> 
     <li><a href="#">Link 3</a></li> 
     <li><a href="#">Link 4</a></li> 
     <li><a href="#">Link 5</a></li> 
     <li><a href="#">Link 6</a></li> 
     <li><a href="#">Link 7</a></li> 
    </ul> 

</div> <!-- #menu --> 

jQuery的

jQuery(document).ready(function(){ 

// Get window width + height 
var windowWidth = $(window).width(); 
var windowHeight = $(window).height(); 

$('#container1').css({ 
    'width': windowWidth, 
    'height': windowHeight 
}); 

// menu toggle 
$('#menuBtnFake').hoverIntent({ 
    over: menuSlideUp 
}); 

$('#menu').mouseleave(function(){ 
    $(this).slideUp(); 
    $('#contentFader').fadeIn(500); 
}); 

$('#menuBtn').click(function(){ 
    $('#menu').slideUp(); 
    $('#contentFader').fadeIn(500); 
}); 

}）;

function menuSlideUp(){ 
$('#menu').slideToggle(500); 
$('#contentFader').fadeOut(700); 

}

Answer 1

我認爲行爲已經堆疊menuSlideUp和效果基本show。 我添加了'if'來檢查滑動的其他函數是否未執行。 http://jsfiddle.net/g7eYH/1/

正確的代碼似乎是：

jQuery(document).ready(function(){ 

    // Get window width + height 
    var windowWidth = $(window).width(); 
    var windowHeight = $(window).height(); 
    document.myslide=0; 

    $('#container1').css({ 
     'width': windowWidth, 
     'height': windowHeight 
    }); 

    // menu toggle 
    $('#menuBtnFake').hoverIntent({ 
     over: menuSlideUp 
    }); 

    $('#menu').mouseleave(function(){ 
     if(document.myslide==0){ 
      $(this).slideUp(500); 
     }else{ 
      //double slide behavior occurs here 
     } 
     $('#contentFader').fadeIn(500); 
    }); 

    $('#menuBtn').click(function(){ 
     $('#menu').slideUp(); 
     $('#contentFader').fadeIn(500); 
    }); 

}); 

function menuSlideUp(){ 
     document.myslide=1; 
     $('#menu').slideToggle(500, function(){ document.myslide=0}); 




    $('#contentFader').fadeOut(700); 
}