Safari 6.1/7.0 中 iframe/鼠标滚轮错误的解决方法答案

【问题标题】：Workaround for iframe/mousewheel bug in Safari 6.1/7.0Safari 6.1/7.0 中 iframe/鼠标滚轮错误的解决方法
【发布时间】：2014-07-08 21:54:31
【问题描述】：

我发现了一个影响 Safari 6.1 和 7.0 的错误（在 Safari 5.1 和 6.0 中没问题）。我已向 Apple 报告。

代码很简单。父页面只有一个 iframe，而 iframe 有一个用于触发警报的 mousewheel 事件的侦听器。 iframe 的内容比 iframe 本身小（稍后会详细介绍）。

如果您通过单击位置栏并按 Enter 来刷新此页面，则 iframe 中的鼠标滚轮事件将不会触发（您不会看到任何警报）。但是，如果您使用刷新按钮进行刷新，它们会。

我需要的是一个解决方法。

我们已经发现了一种方法是让 iframe 的内容溢出 iframe 的边界。鼠标滚轮事件现在触发，但滚动条和内容移动是不可接受的。（不管为什么选择使用 iframe ——这不取决于我。）

有什么想法吗？

【问题讨论】：

【解决方案1】：

令人难以置信的是，这个功能仍然存在于 Safari 8 中。

只需将 onmousewheel="" 属性添加到 iframe 标记即可。

<iframe src="..." onmousewheel=""></iframe>

【讨论】：

【解决方案2】：

我找到了一个在我的用例中可以接受的解决方法。

将以下 CSS 添加到 iframe 内容会显示事件。

html, body {
    width: 100%;
    padding: 0;
    margin: 0;
}
body {
    padding-right: 1px;
    overflow-x: hidden;
}

没有滚动条显示，因为默认使用内容框大小模型，宽度为100%，这意味着填充的像素从右边缘溢出，隐藏。

【讨论】：