css - 负位置：绝对导致 iPad 上的水平滚动

Question

我在我的网站（访问http://thecasket.co.uk/ ）中添加了一个侧边栏选项卡“订阅”（jquery.tabSlideOut.v1.3.js ）。桌面浏览器很好，但会导致 iPad 上出现水平滚动条 - 并且页面开始滑动。该选项卡在 javascript 中设置了一个负绝对位置（-290px，宽度 + 在我的 css 中用于滑出 div 的填充）。在 iPad 上，滚动条采用幻灯片 div 的宽度。

<div class="slide-out-div">
my subscribe form
</div>

.slide-out-div {
padding: 20px;
width: 250px;
background: rgb(255,255,255);
z-index: 9999;
    -webkit-overflow-scrolling
}

我尝试添加：-webkit-overflow-scrolling: touch; 但似乎什么也没做，我不确定这会做什么。

任何有关修复卷轴的帮助，非常感谢。

Answer 1

由于您没有overflow:hidden对任何父容器进行定义，因此移动设备会将视口扩展到内容的大小。您可以使用这种方法并设置值overflow，或者您可以在. 两者都应该做到这一点。position: fixedabsoluteslide-out-div

还要注意 - 元素的文本<a>是text-indent: -99999px;“内容”，但我想它应该是“订阅”。