我在 iphone (iOS 9.2) 上的 safari 中遇到了一个奇怪的行为
如果你在桌面上看到这个页面http://jsbin.com/vofubidaxe,有 3 张熊猫图片,你可以滚动它
但是,如果您在 iphone safari 上看到它,有时(并非所有时间)您无法滚动它。卷轴似乎卡住了(不确定卡住是否是描述行为的正确词)
在这里编辑http://jsbin.com/vofubidaxe/edit?html,css,output
要点https://gist.github.com/anonymous/938fc5f84222d8ed06cdcb7f6092da8d
导航标签有一个position: fixed,如果它被删除,滚动恢复正常。
抱歉,如果这是 safari 中的已知错误。如何修复?
添加position:fixed元素会将其从文档 DOM 中删除 - 因此 panda 图像不会在实际文档上呈现。
有时它会“卡住”,因为您可能触摸到了文档 - 因此轻拂会强制文档滚动而不是固定元素。
解决方案是删除相对元素并为固定父元素提供高度 - 如果您想要它的完整高度,请尝试添加top:0;right:0;bottom:0;left:0然后溢出它。
然而,这在 iPhone 上可以工作,但会因为溢出元素支持不佳而对其他设备(Android、Windows Phone 等)造成问题。