javascript - 为什么我的菜单栏求助于 :hover behavior onload?

Question

我正在使用 dsmoothmenu jquery 插件在我的页面顶部生成一个工具栏 -- 大约一个月前，页面开始加载(大部分时间)，菜单栏的第一项已暴露 - - 就像用户将鼠标悬停在元素上一样。我花了几个小时试图找出造成这种情况的原因，但没有取得任何进展。

我有另一个页面，它使用完全相同的菜单标记和相同的 dsmoothmenu js/css，但没有表现出上述行为。所以我认为它可能与元标记或被覆盖的样式有关。通过检查员的调查，似乎 ul#other_cities 元素被某些东西赋予了 display:block，这覆盖了 display 的默认样式:无，在用户将鼠标悬停在元素上之前，它应该处于事件状态。

这是一个问题示例:http://www.foodtrucksmap.com/la/

还有一个工作示例:http://www.foodtrucksmap.com/iphone.html

编辑: 所以我发现只有在页面加载完成时鼠标位于窗口外时问题才会出现。如果鼠标一直悬停在页面上，菜单栏不会向下滑动。这一点以及它似乎只发生在 chrome 中这一事实让我感到非常困惑。

Answer 1

当我右键单击链接然后“在新标签页中打开链接”或“...新窗口”在后台打开窗口时，我可以在 Chrome 中看到您的问题。这让我得出了这个结论。

Google 的 Chrome，出于某种奇怪的原因，将“虚拟”指针定位在触发脚本的位置 top:1, left:1。一旦我们引入实际的“物理”指针，这个位置就会接管，问题就消失了。

因为这似乎是 Chrome 的一个问题，我们只能通过一些小技巧来防止它。我会说我们给主要的 div#wrapper 一些左边的喘息空间吗？或者可能像第二个例子一样最重要的东西!!!