1. 程式人生 > >ios position:fixed 上滑下拉抖動

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;

}

好了,完美解決問題