什么可以阻止 CSS :hover 类工作？

Question

什么可以防止 CSS :hover 伪类被触发，无论是使用 CSS 还是 JavaScript？

我正在尝试调试第三方自定义日历控件中的一个非常棘手的问题。客户希望在用户将鼠标悬停在日期上时突出显示日期——这是非常标准的东西。但是有些东西顽固地阻止了:hover 类按预期工作。

我可以使用选择器定位日期单元格并操作background-color，而不会出现任何问题。但是，将 :hover 伪类添加到该选择器不起作用。

很遗憾，我无法发布任何代码，因为这是一个需要帐户才能使用的私人应用程序。老实说，意大利面条太多了，我什至不知道要包括什么……控件是用纯 JS 构建的，这里没有 jQuery，没有siree。几百行 JS，加上几百行 CSS……不知道使用 jQuery 日历控件有什么问题。

是否有一组已知的东西可以破坏:hover？这可能是一个事件传播问题，是由从onhover 事件处理程序返回false 引起的吗？

对于调试此问题还有其他建议吗？使用浏览器工具不是很有效，因为除非我悬停，否则不会触发:hover 规则。在那里抓到 22 个。

编辑：This answer 似乎是罪魁祸首。他们肯定在组合中使用了一些绝对定位......

编辑 2：使用 Chrome 的开发人员工具手动应用 :hover 状态有效，确认我的选择器不是问题。有些东西阻止了:hover 状态被触发。日历控件被实现为一个 HTML 表格，每周在一行中，每个日期在一个单元格中。这似乎是一个分层问题，但向单元格添加高 z-index 并没有任何作用。

Answer 1

Chrome 的“开发者工具”允许您切换元素的状态。也许您可以尝试一下，看看您是否能更深入地了解您遇到的问题？

Answer 2

它往往与元素的分层有关。通常，这可以通过重新分层 HTML 以使锚点位于顶部或将其设置为 position: relative 来解决。

Answer 3

您可能会在取消悬停时使用!important，这会阻止悬停。