javascript - h5怎么让一个元素固定在键盘顶部

Question

就像这样的

Answer 1

IOS下固定定位会有问题、我也是这几天才发现的、可以参考这篇文章

http://www.haorooms.com/post/...

具体的、知乎的移动web和百度的移动web也会有每当键盘弹出、fixed框的fixed属性失效的问题、

只是IOS有这个问题、安卓的键盘会挤压dom、ios是虚拟键盘和dom不发生关系、

只是提出这个问题、希望能在你的考虑之中

Answer 2

既然问题是

fixed 定位好的元素跟随页面滚动了起来

那就不让fixed定位的元素滚动就好了。解决方案是将滚动元素从跟随body滚动改为元素内滚动，具体改动为：

• 将滚动元素设置为absolute定位，并限定宽高。

• 给滚动元素设置

     -webkit-overflow-scrolling: touch;
     overflow-x: hidden;
     overflow-y: scroll;
  

如此即可避免body滚动导致fixed元素跟随滚动

---

至于题主问的最基本的定位问题

h5怎么让一个元素固定在键盘顶部

答案是给该元素设置CSS样式

position: fixed;
bottom: 0;
margin: 0 auto;