ios position:fixed 上滑下拉抖动
Posted 吼吼酱
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ios position:fixed 上滑下拉抖动相关的知识,希望对你有一定的参考价值。
ios position:fixed 上滑下拉抖动
最近呢遇到一个ios的兼容问题,界面是需要一个头底部的固定的效果,用的position:fixed定位布局,写完测试发现安卓手机正常的,按时ios上会出现上滑或者下拉的时候头部或者底部被带下来,然后过一会自己在滑上去,感觉很卡顿,感官很不好,最后发现是position:fixed的兼容问题
百度找了两个方案分别用了一下
方案一
transform: translateZ(0); -webkit-transform: translateZ(0);
解释:在使用position:fixed的元素上加上该属性。
但是这个我写了并没有奏效,按照他的用法,不知道是不是我写的问题,也是很郁闷了
方案二
页面布局
<header></header>//头部置顶 <div></div> //中间滚动 <footer></footer>//底部置底
css
header{ position:fixed; top:0; } header{ position:absolute; overflow-y:scroll; } footer{ position:fixed; bottom:0; }
好了,完美解决问题
以上是关于ios position:fixed 上滑下拉抖动的主要内容,如果未能解决你的问题,请参考以下文章
解决ios微信移动端的position: fixed; 支持性不好的问题 && 禁用下拉暴露黑底的功能