html - 带有可滚动元素的 CSS Hover 在较新的 Chrome 浏览器中不起作用

Question

我正在运行以下 fiddle

View here

它使用简单的悬停触发器来显示内容

ul li:hover > ul
{
    display:block
}

它会在悬停时创建一个下拉菜单，如果元素太多，则会出现一个滚动条。

这在 IE 和 Firefox 中工作正常，但我注意到如果滚动条在 chrome 中被鼠标悬停，它会在您滚动元素之前终止悬停状态。这似乎是后来的 Chrome 浏览器中的一个问题，因为在 Chrome 55 中它按预期工作，但在 Chrome 56.0 (.2924) 上会发生这种情况。

我不想专门引入 JS 来解决这个问题，希望一切都在 CSS 中进行管理。

任何人都可以看到为什么这个悬停状态没有被兑现的问题吗？

谢谢

Answer 1

Chrome 56 中存在一个错误，悬停在滚动条上不会导致该元素的悬停事件。它将固定为 57。https://bugs.chromium.org/p/chromium/issues/detail?id=686678