问题:
位置固定不适用于旧版本的 iOS 和某些 Blackberry 浏览器,导致元素随页面滚动。
解决方案:
要解决此问题,请添加 -webkit-backface-visibility:hidden 属性固定元素。
<code class="css">.fixed { position: fixed; top: 0; left: 0; width: 320px; height: 50px; background: red; -webkit-backface-visibility: hidden; /* This is the fix */ }</code>
说明:
-webkit-backface-visibility 属性控制元素在远离用户时的显示方式并且默认情况下不可见。将其设置为 hidden 会强制浏览器为元素维护相同的渲染上下文,防止其受到滚动的影响。
示例:
<code class="html"><div class="fixed"> Hi I'm Position Fixed </div> <div> <!-- Sample text --> </div></code>
通过将 -webkit-backface-visibility:hidden 属性应用于固定元素,您可以确保该元素保持在屏幕上的相同位置,即使在 iOS 和 Blackberry 浏览器中不完全支持修复。
以上是如何解决移动浏览器中的'位置固定”问题?的详细内容。更多信息请关注PHP中文网其他相关文章!