2048
登录
没  有  难  学  的  前  端
登 录
×
<返回上一级

ios上-webkit-overflow-scrolling与position的bug

ioscsshtml作者:猿2048志愿者

布局

clipboard.png
如上图,.fb-box是一个大div,包含着页面上的所有元素,包括所看到的那个弹窗.dialog-img,并且设置了height:100%;-webkit-overflow-scrolling:touch;

问题

但是这样设置,在ios上会有一个bug,页面滚动一定的距离后,点击了显示弹窗,再关闭的话,就会发现,弹窗的一部分还“留在页面上”。定位需要,-webkit-overflow-scrolling:touch;也需要。

clipboard.png

解决方案

把弹窗的div和.fb-box以兄弟节点的方式布局,在外层再弄一个div包住,这个坑就算爬起来了,效果如下

clipboard.png

clipboard.png

本文来源于网络:查看 >
« 上一篇:我所知道的CSS清除浮动四种方法
» 下一篇:原生js+css 实现 material design 点击效果
评论
点击刷新
评论
相关博文
×添加代码片段