0

所以我正在尝试使用 hoverIntent 重构一些 jQuery mouseenters。当我为每个导航项单独调用 hoverIntent 时，一切都有效，但是当我尝试使用以下代码时，第一次 mouseover 没有任何反应，然后它就可以工作了：

$('.navItem1').on('hover', function(){
    navHoverIntent(this);
});

$('.navItem2').on('hover', function(){
    navHoverIntent(this);
});

$('.navItem3').on('hover', function(){
    navHoverIntent(this);
});

$('.navItem4').on('hover', function(){
    navHoverIntent(this);

});

function navHoverIntent(className) {
//set some vars for use in hoverIntent
var currentDiv = $(className); 
var cubeImg = currentDiv.find('img');
var childDivs = currentDiv.find('div'); 
var navTitle = childDivs[0]; 
var subNav = childDivs[1]; 
//now calling hoverIntent

currentDiv.hoverIntent({
    over: function(){
        if(cubeImg.css("display")=="block"){
        navTitle.css("color","#262261");
        }
        currentDiv.css("backgroundColor","#d7d7d7");
        $(subNav).show();
        },
    out: function(){
        if(cubeImg.css("display")=="block"){
        navTitle.css("color","#8CC640");
        currentDiv.css("backgroundColor","#262261");
        }else{
        currentDiv.css("backgroundColor","transparent");
        $("#subnav1").hide();
        $("#subnav2").hide();
        $("#subnav3").hide();
        $("#subnav4").hide();
        }
        },

    });
}

任何帮助将非常感激！

4

1 回答 1

0

如果您仍然需要这个答案，从我可以看到您的问题是，在第一次悬停时，您正在添加事件侦听器（但它也没有被触发）。

此外，您将在每次悬停时添加一个新的事件侦听器，而不删除旧的事件侦听器。

如果这不是预期的行为，您可以自己为每个“ navItem ”调用该函数并将其从悬停中删除。

希望有帮助

于 2014-01-17T07:30:00.070 回答