Question

所以我<div />与overflow: auto。其中包含一些<input type="text" />个元素。 div的一半是隐藏的;用户应该点击一些导航链接来隐藏前半部分并显示下半部分。

事实证明，在Chrome中（不是在Firefox或IE中），如果用户将光标放在<input type="text" />内，然后将其拖动到右侧，则可以进行<div />滚动“在右边显示其内容的后半部分!!

我能想出的最好的方法是阻止这种情况，这是一种愚蠢的setInterval检查，必要时会重新定位div。有什么更清洁吗？

Answer 1

为什么不这样：

<div class="container">
  <div class="content">
  </div>
</div>

.container {
  width:400px;
  overflow:hidden;
  position:relative;
}

.container .content {
  width:800px;
  position:absolute;
  top:0;
  left:0;
}

内容的宽度是容器的两倍，但后半部分是隐藏的。要显示下半部分，只需在right:0; div上设置left:-400px;（或.content）。

更新

将内容的宽度设置为容器的宽度（在此示例中为400px），直到您准备好显示第二部分，然后将内容的大小调整为800px并移动它以显示新内容。

在Chrome中使用overflow：auto时阻止用户滚动

1 个答案:

更新