如何让我的下拉列表保持下拉状态？
我目前正在开发的网站位于： http://counterbeing.com
我试图解决的问题是，当您将鼠标悬停在“类别”上时按钮时，子菜单项会弹出，但在单击它们之前就会消失。
我尝试过各种各样的事情。一方面，我试图将子菜单项所包含的 div 定义为也将触发动画的东西，但这似乎不起作用......
这是我用来抓取的 javascript 文件两层。我把它分成两层，因为其中一层有点透明。
$(document).ready(function() {
($("div#CategoriesLink")||$("div#CategoryButtonHolder")).hover(function(){
$("div#navdrop").animate({
top: "0px"
})
$("div#CategoryButtonHolder").animate({
top: "0px"
})
});
$("div#CategoriesLink").mouseout(function(){
$("div#navdrop").animate({
top: "-162px"
})
$("div#CategoryButtonHolder").animate({
top: "-162px"
})
});
});
The site I'm currently working on is located at:
http://counterbeing.com
The problem I'm trying to solve is that when you run your mouse over the "Categories" button, the sub-menu items pop up, but then disappear before you can click them.
I've tried a variety of things. For one thing, I was attempting to define the div that the sub menu items are wrapped in as something that will also trigger the animation, but that doesn't seem to work...
Here is the javascript file I'm using to grab both layers. I have it divided into 2 layers because one of them is somewhat transparent.
$(document).ready(function() {
($("div#CategoriesLink")||$("div#CategoryButtonHolder")).hover(function(){
$("div#navdrop").animate({
top: "0px"
})
$("div#CategoryButtonHolder").animate({
top: "0px"
})
});
$("div#CategoriesLink").mouseout(function(){
$("div#navdrop").animate({
top: "-162px"
})
$("div#CategoryButtonHolder").animate({
top: "-162px"
})
});
});
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
因此，第一件事是，如果您在 CategoryButtonHolder 上使用 rgba 背景，则不需要使用两个 div。
接下来，您将使用 mouseout 事件处理程序来为 div 重新设置动画。因此，每次鼠标离开按钮时，都会激活鼠标移开。尝试将鼠标移出处理程序移至 CategoryButtonHolder。
So, first thing is you don't need to use two divs if you use an rgba background on the CategoryButtonHolder.
Next, you're using a mouseout event handler to animate the div back up. So every time you mouse leaves the button, you activate the mouseout. Try moving the mouseout handler to the CategoryButtonHolder.
对于悬停，解决此类问题的一个不错的插件是hoverintent插件： http:// cherne.net/brian/resources/jquery.hoverIntent.html；你可以让它等待并保持 X 毫秒时间，然后它就非常顺利了。
HTH。
For hover, a nice plugin that solved that kind of problem was the hoverintent plugin: http://cherne.net/brian/resources/jquery.hoverIntent.html; you can make it wait and stay up for X ms time and its really smooth then.
HTH.