Question

此问题仅出现在Firefox中。

我尝试尽可能减少我的代码： JSFiddle Example

我在页面底部有一个菜单显示：无。上面是我调用slideToggle函数的Button。你能不能在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和slideUp。如果没有执行滑动的其他功能，我添加了'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);
}

元素悬停slideToggle只在Firefox中出类拔萃

1 个答案: