固定位置分割防止焦点在元素之间移动时滚动

Fixed Position Div prevents scrolling when focus moves betwen its elements

本文关键字：之间 元素 移动 滚动 焦点 位置 定位 分割      更新时间：2023-09-26

我在一个需要固定位置的div中有两个文本框。问题是，当我在第一个文本框上时，如果我切换到第二个文本框，由于div的固定位置属性，页面不会向下滚动到第二个中。有什么方法可以保持div的固定地位，但仍然向下滚动到有焦点的元素吗？

<div style="width:100%;height:100%;position:fixed;">
<input id="FirstName"> Lots of padding goes here
<input id="LastName">
 </div>

完整的代码请看我的小提琴https://jsfiddle.net/43dLktss/1/

我在想也许jQuery在文本框的焦点事件处理程序上设置了动画？

不需要额外的javascript/jQuery。添加一个内部div，具有相对位置height:100%;和overflow:scroll;

<div style="width:100%;height:100%;position:fixed;">
  <div style="height:100%;position:relative;overflow:scroll;">
    <input id="FirstName"> lots of padding here<input id="LastName">
  </div>
</div>

查看更新后的小提琴：https://jsfiddle.net/sablefoste/s0jmzph0/

相关文章：