文章/答案/技术大牛

发布

社区首页 >问答首页 >jQuery“：悬停”似乎不适用于

问jQuery“：悬停”似乎不适用于
EN

Stack Overflow用户

提问于 2014-02-12 22:14:04

回答 1查看 266关注 0票数 0

如果您查看此页面：

http://bbdesign.com/berksfoods.com/retail-deli-meats-roast-beef.htm

将鼠标放在左上角(大徽标右侧)的“产品”按钮上，然后向下移动到显示的菜单上。如果您从“产品”按钮和“下拉菜单”中移出，它将消失。这是意料之中的。

大的标志是透明的巴布亚新几内亚。我在“产品”按钮和下拉菜单上有一个jQuery事件"mouseleave“，当鼠标不再在它们上面时，它会导致菜单消失。

当然，如果鼠标经过徽标，那就意味着菜单关闭了(因为它不是“mouseleave”容器的子容器)。我通过添加以下内容解决了这个问题：

if (!$('img#logo').is(':hover')){
    $(this).children('div#menu1bg').slideUp(200);
}

换句话说，如果触发了"mouseleave“事件，首先检查鼠标是否在徽标(img#logo)上。如果它在徽标上方，不要关闭菜单。

这看起来很好，只是在中根本不起作用。“悬停”和浏览器是否存在已知的问题？或者，是否有其他方式编码相同的东西，将更好地工作在所有浏览器？

谢谢!

jquery

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-02-12 22:31:36

问题不在您的jQuery中，而是在您的CSS中。IE不受支持CSS标记的欢迎，但它应该在IE7中工作。无论如何，尝试添加一个严格的!DOCTYPE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

此DTD包含所有HTML元素和属性，但不包括表示元素或不推荐元素(如字体)。不允许使用Frameset。

尽管如此，让:hover在a元素上运行。将您的徽标包装在一个a标记中，它可能会工作。

如果你看看这个，你就没什么办法了。

实际上，在任何情况下，都可以使用JQuery的.mouseLeave和.hover函数：

$('img#logo').mouseLeave(function()
{
    $(this).children('div#menu1bg').slideUp(200);
});

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/21740955

复制

相似问题

问jQuery“：悬停”似乎不适用于
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery“：悬停”似乎不适用于EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery“：悬停”似乎不适用于
EN