Question

我有一个足够长的简单html页面，用户需要滚动页面。我希望页面底部有一个带位置的div：固定并在他里面有一个textarea。当用户点击文本区域并显示虚拟键盘时，我希望div位置保持在底部，而不是在页面中间，如下图所示：

以下是我使用的代码：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来进行修正？

Answer 1

也许问题与iOS Mobile Safari中的一个众所周知的错误有关，这种错误发生在滚动/焦点跳跃和固定定位上。许多人已经写过这篇文章，很多人都做了黑客攻击或改变他们的设计以部分解决问题。

在我参考时，请看一下：

当textarea聚焦时，iOS Safari css位置固定

1 个答案: