javascript - iOS Safari css 位置在 textarea 聚焦时固定

标签 javascript html ios css mobile-safari

我有一个足够长的简单 html 页面,用户需要滚动页面。我想在页面底部有一个带有 postion:fixed 的 div,在他里面有一个文本区域。 当用户单击文本区域并出现虚拟键盘时,我希望 div 位置保持在底部,而不是像这张照片中那样位于页面中间:enter image description here

这是我使用的代码:https://jsfiddle.net/capz19yg/

    .inputFixed{
        position:fixed;
        bottom:0px;
        right:0px;
        width:100%;
        height:50px;
        background-color:lightgrey;
    }

    textarea{
        height:40px;
        width:300px;
        position:absolute;
        bottom:5px;
        right:10px;
        padding:0px;
        margin:0px;
        border:none;
    }


<div class="inputFixed">
    <textarea></textarea>
</div>

有解决办法吗?也许一些 javascript 来进行更正?

最佳答案

也许这些问题与 iOS Mobile Safari 中的一个众所周知的错误有关,该错误发生在滚动/焦点跳跃和固定定位时。许多人都写过关于它的文章,许多人进行了黑客攻击或更改了他们的设计以部分解决该问题。

正如我所提到的,看看:

关于javascript - iOS Safari css 位置在 textarea 聚焦时固定,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39873553/

相关文章:

javascript - 在 HTML 中为组合框设置样式选择和输入元素

ios - 是否仍然可以为旧的 iOS 设备开发?

ios - 是否可以在构建阶段的编译源中不添加 "fno-objc-arc"的情况下启用非弧文件?

javascript - 是否有其他方法使用 Jquery 删除父表行和子表行

javascript - 在 JavaScript 中 trim 字符串

javascript - 如何使用二级 div 向下移动一个 div 元素?

html - 响应性不适用于忘记密码链接

iphone - 当位置发生变化并且我的应用程序处于后台时,我可以收到本地通知吗?

javascript - 将其与伪选择器 jquery 一起使用

javascript - Bluemix 在出现下一个错误时崩溃