Safari 6.1/7.0中iframe/mousewheel错误的解决方法

tre*_*mby 6 html javascript safari

我发现了一个影响Safari 6.1和7.0的错误(在Safari 5.1和6.0中没问题).我已经向Apple报告过了.

测试用例在这里:http://tremby.net/dump/iframe-safari/

代码很简单.父页面只有一个iframe,iframe有一个触发器,用于mousewheel触发警报的事件.iframe的内容小于iframe本身(稍后会详细介绍).

如果通过单击位置栏并按Enter来刷新此页面,则iframe中的鼠标滚轮事件将不会触发(您看不到警报).但是如果你用刷新按钮刷新它们会.

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

我们已经发现的一个是让iframe的内容溢出iframe的边界.鼠标滚轮事件现在会触发,但滚动条和内容移动是不可接受的.(没关系为什么选择使用iframe - 这不取决于我.)

有任何想法吗?

dan*_*cek 6

令人难以置信的是,Safari 8中仍然存在此功能.

我在这里找到了很好的解决方法:https://bugs.webkit.org/show_bug.cgi?id = 124139

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

<iframe src="..." onmousewheel=""></iframe>
Run Code Online (Sandbox Code Playgroud)


tre*_*mby 0

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

将以下 CSS 添加到 iframe 内容将使事件显示出来。

html, body {
    width: 100%;
    padding: 0;
    margin: 0;
}
body {
    padding-right: 1px;
    overflow-x: hidden;
}
Run Code Online (Sandbox Code Playgroud)

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

示例位于http://tremby.net/dump/iframe-safari-workaround/