ios - iPhone 在弹出窗口中出现滚动问题

Question

在 iPhone 中遇到问题，创建一个聊天网络应用程序。在弹出固定位置有聊天窗口。当单击文本输入发送消息时，iPhone 键盘将其打开并将聊天部分的标题部分移至顶部

需要修复标题和文本区域应始终与 whats-app 中一样可见将标题部分设置为固定位置，固定相同的文本区域，即使键盘打开或不打开防止标题在顶部移动意味着防止 iPhone 滚动

注意:它在安卓手机上运行良好。只有 iPhone 浏览器出现问题，可能是由于 iPhone 滚动。

Answer 1

这是一个简单的概念性示例:

<article class="pop-up">
  <h3>Title</h3>
  <div class="content"> <p>Some scrollable content ...</p> </div>
  <div> Some CTA buttons that should be visible for the user </div>
</section>

CSS:

.pop-up {
 position: fixed;
 // some other styles to display it as a popup
}

.content {
position: relative; 
max-height: 100px; // set any max height that fits your design
overflow-y: scroll;
}