面对iPhone中的问题,创建一个聊天的Web应用程序.弹出固定位置的聊天窗口.当点击文本输入发送消息时,iPhone键盘打开它并将聊天部分的标题部分移到顶部
需要修复
标题和文本区域应始终与whats-app中的相同
将标题部分设置为固定位置,并将相同的文本区域设置为固定,甚至键盘是否打开
防止头顶移位意味着防止iPhone滚动
注意：它在Android手机中运行良好.只有iPhone浏览器问题,可能是由于iPhone滚动.
解决方法
这是一个简单的概念示例：
<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;
}
