下拉式内容会自动显示,当我将其悬停时,它会使用jquery自行隐藏

下拉式内容会自动显示,当我将其悬停时,它会使用jquery自行隐藏,jquery,menu,hover,dropdown,Jquery,Menu,Hover,Dropdown,首先我真的很抱歉,因为我是一个新用户 尝试谷歌,但我找不到同样的问题 谁能告诉我为什么导航栏下拉按钮突然出现。隐藏,当我解开它时,它变成了。显示 我知道人们不会理解。这是我的问题 $(文档).ready(函数(){ $('.menubar ul li').hover(函数(){ $(this).find('.dropdown content').slideToggle(400); }); }); ol,ul{ 边际上限:0; 边缘底部:10px; 显示:内联块; 列表样式类型:无; } div

首先我真的很抱歉,因为我是一个新用户

尝试谷歌,但我找不到同样的问题

谁能告诉我为什么导航栏下拉按钮突然出现。隐藏,当我解开它时,它变成了。显示

我知道人们不会理解。这是我的问题

$(文档).ready(函数(){
$('.menubar ul li').hover(函数(){
$(this).find('.dropdown content').slideToggle(400);
});
});
ol,ul{
边际上限:0;
边缘底部:10px;
显示:内联块;
列表样式类型:无;
}
div{
显示:块;
}
居中{
显示:块;
文本对齐:-webkit中心;
}
.clearfix:之后{
显示:块;
明确:两者皆有;
}
梅努巴先生{
宽度:1100px;
高度:50px;
文本对齐:居中;
背景色:#4545;
左边距:自动;
右边距:自动;
列表样式类型:无;
}
.菜单{
宽度:100%;
文字装饰:无;
}
李先生{
浮动:中心;
显示:内联;
列表样式:无;
字体系列:“Helvetica Neue”,“Helvetica”,Helvetica,Arial,无衬线;
字体大小:正常;
字体风格:普通;
}
.菜单李.购物车{
背景:url(“images/shoppingcart.png”);
宽度:61px;
}
.菜单a{
过渡:全线性0.2s;
颜色:白色;
字体大小:15px;
字体大小:正常;
字体风格:普通;
}
.menu li:悬停>a、.menu.当前项>a{
颜色:#aa79da;
身高:100%;
光标:指针;
文本阴影:0 10px紫色;
背景色:#4c4b4b;
}
.menu>ul>li{
左边距:自动;
右边距:自动;
文本对齐:居中;
显示:内联块;
位置:相对位置;
文字装饰:无;
}
.menu>ul>li>a{
填充:30px 30px;
填充顶部:18px;
垫底:10px;
显示:内联块;
文本阴影:0px 1px 0px rgba(0,0,0,0.4);
文字装饰:无;
边际上限:0px;
}
--------------------------------------------------------------
保险商实验室{
列表样式类型:无;
保证金:0;
填充:0;
溢出:隐藏;
背景色:#333;
显示:内联块;
列表样式类型:无;
}
李{
浮动:左;
}
李安,.dropbtn{
显示:内联块;
颜色:白色;
文本对齐:居中;
填充:14px 16px;
文字装饰:无;
}
li a:悬停,.下拉:悬停.dropbtn{
/*背景色:红色*/
}
.主动导航{
背景色:#5e4279;
}
.主动导航a{
颜色:白色;
字体大小:粗体;
}
.activeNav li:hover>a.activeNav.current item>a{
/*背景色:#707070*/
文字装饰:无;
颜色:白色;
字体大小:粗体;
}
li.下拉列表{
显示:内联块;
}
.下拉内容{
/*边缘顶部:6px*/
/*宽度:100%*/
显示:无;
位置:绝对位置;
盒影:0px 8px 16px 0px rgba(0,0,0,0.2);
宽度:自动;
背景色:#4c4b4b;
z指数:100;
}
.下拉列表1{
边际上限:0px;
宽度:200px;
背景色:#4c4b4b;
浮动:左;
}
.下拉列表2{
宽度:200px;
背景色:#4c4b4b;
左边距:200px;
浮动:中心;
}
.下拉列表3{
宽度:200px;
背景色:#4c4b4b;
浮动:对;
左边距:400px;
利润上限:-269px;
}
.下拉内容a{
颜色:白色;
填充:12px 16px;
文字装饰:无;
显示:块;
字体大小:12px;
文本对齐:居中;
文字装饰:无;
}
.下拉列表内容a:悬停{
/*背景色:#707070*/
文字装饰:无;
文本阴影:0 10px紫色;
颜色:#aa79da;
字体大小:粗体;
}
.下拉:悬停.下拉内容{
显示:块;
}

  • KTD领导层

我尚未测试此代码,但是您是否可以尝试使用
mouseover
mouseout
检查此问题是否没有发生

$(document).ready(function(){
  $('.menubar ul li.dropdown').mouseover(function(){
     $(this).find('.dropdown-content').slideDown(400);
  }).mouseout(function(){
     $(this).find('.dropdown-content').slideUp(400);
  });
});
希望这有帮助

$(文档).ready(函数(){
$('.menubar ul li').mouseleave(函数(){
$(this.find('.dropdown content').slideUp(4000);
});
});
ol,
保险商实验室{
边际上限:0;
边缘底部:10px;
显示:内联块;
列表样式类型:无;
}
div{
显示:块;
}
居中{
显示:块;
文本对齐:-webkit中心;
}
.clearfix:之后{
显示:块;
明确:两者皆有;
}
梅努巴先生{
宽度:1100px;
高度:50px;
文本对齐:居中;
背景色:#4545;
左边距:自动;
右边距:自动;
列表样式类型:无;
}
.菜单{
宽度:100%;
文字装饰:无;
}
李先生{
浮动:中心;
显示:内联;
列表样式:无;
字体系列:“Helvetica Neue”,“Helvetica”,Helvetica,Arial,无衬线;
字体大小:正常;
字体风格:普通;
}
.菜单李.购物车{
背景:url(“images/shoppingcart.png”);
宽度:61px;
}
.菜单a{
过渡:全线性0.2s;
颜色:白色;
字体大小:15px;
字体大小:正常;
字体风格:普通;
}
.菜单li:悬停>a,
.菜单.当前项>a{
颜色:#aa79da;
身高:100%;
光标:指针;
文本阴影:0 10px紫色;
背景色:#4c4b4b;
}
.menu>ul>li{
左边距:自动;
右边距:自动;
文本对齐:居中;
显示:内联块;
位置:相对位置;
文字装饰:无;
}
.menu>ul>li>a{
填充:30px 30px;
填充顶部:18px;
垫底:10px;
显示:内联块;
文本阴影:0px 1px 0px rgba(0,0,0,0.4);
文字装饰:无;
边际上限:0px;
}
--------------------------------------------------------------保险商实验室{
列表样式类型:无;
保证金:0;
填充:0;
溢出:隐藏;
背景色:#333;
显示:内联块;
列表样式类型:无;
}
李{
浮动:左;
}
李a,,
.dropbtn{
显示:内联块;
颜色:白色;
文本对齐:居中;
填充:14px 16px;
文字装饰:无;
}
李a:悬停,
.dropdown:悬停.dropbtn{
/*背景色:红色*/
}
阿维娜