我有一点 IE8 问题（听起来很熟悉？）
我有一个按钮。当您将鼠标悬停在按钮上时，悬停状态会产生一个较大的框，其中包含 html。在这种特殊情况下，它是一个小型音乐播放器。
所以它是这样的，当您将鼠标悬停在按钮上时，它会生成一个带有可点击链接和一些文本的小型音乐播放器。您可以在此框内的任何位置移动鼠标，但是一旦您离开框/音乐播放器，悬停状态就会再次消失。对不起，但我不知道该怎么解释。
除了 IE8，这一切都是一种享受。
在IE8中，鼠标一离开原来的小按钮，悬停状态就消失了。所以在音乐播放器中导航变得不可能。
现在我注意到，当悬停框中没有 html 时，它可以正常工作，但是当有 html（在本例中为 iframe）时，只要我触摸悬停框中的任何 html，它就会失去悬停。所以看起来问题不在于悬停框，而是框内的代码使其失去焦点
我想知道的是，这是 IE8 中的一个已知问题，还是我这边的编码不好。在这种情况下，我可以发布 CSS。
我在 IE8 中也遇到了 :HOVER 状态的问题，我注意到相同的 CSS（甚至指向相同的外部 CSS 文件）在某些页面上有效，但在其他页面上无效。对我来说，解决方案是始终将 DOCTYPE 添加到所有页面的顶部（在起始 HTML 标记上方）。
现在看起来很明显，但有时（尤其是在编辑旧站点时）并不总是指定 DOCTYPE。
我希望这有帮助！
您的问题似乎不在于悬停本身。首先，您假设一些窗口高度，如果高度不同，您的项目看起来很奇怪。假设您对此类假设进行了一些非常精确的计算，您的问题可能是盒子模型问题。box-sizing:border-box可能会有所帮助，但您必须重新计算所有内容。
您也可以在元素被隐藏/下拉之前使用超时，这样微型鼠标移动就不会晃动元素，并且可能允许“捕捉”它们。
考虑到这两件事，所有悬停问题都应该是可以解决的。
编辑：对于 iframe hover 看看：iframe hover not working in IE (all versions)。