悬停内容悬停不起作用

HoverIntent hover not working

本文关键字：悬停 不起作用      更新时间：2023-09-26

JSFiddle-http://jsfiddle.net/4aHmv/

在我的jsfiddle中，我试图创建一个带有悬停操作的下拉菜单，当鼠标悬停在上面时，它会下拉子菜单。

这是我的悬停意图代码：我不确定我是否做错了什么。

$(".scooters").hoverIntent(makeTall,makeShort);
function makeTall(){$('.scooters').mouseenter(function(){
    $(this).find('.cbp-hrsub').slideDown();
});}
function makeShort(){$('.scooters').mouseleave(function(){
    $(this).find('.cbp-hrsub').slideUp();
});}

在hoverintent函数中，我刚刚使用了我创建的代码，该代码使用jquery hover。

$('.scooters').mouseenter(function(){
    $(this).find('.cbp-hrsub').slideDown();
});
$('.scooters').mouseleave(function(){
    $(this).find('.cbp-hrsub').slideUp();
});

取消注释并在jsfiddle中注释hoverintent代码将使其工作，但使用jquery hover。我需要在气垫中做一些不同的事情来让它发挥作用吗。

谢谢。

首先，hoverIntent是jQuery插件，因此您需要将jQuery添加到jsfiddle 中

其次，在代码实现之前，您不能使用插件，它也是关于水平菜单的

第三，不能使用尚未声明的函数，因此makeTall和makeShort必须在hoverIntent(makeTall,makeShort) 之前声明

第四，你不需要在makeTall/makeShort中使用鼠标输入/离开，hoverIntent已经完成了你需要的

工作馈线

相关文章：