ios fixed定位bug位置偏移

本文主要介紹移動端input獲取焦點時,IOS固定定位fixed失效,位置偏移。

一、場景描述

移動端ios下,input獲取焦點時,固定定位的fixed會轉化爲absoult屬性,滾動條滾動超過可視區域,導致位置偏移。

二、解決方案

2.1將fixed的定位與滾動區域分離成2個部分
2.2滾動區域做absoult佈局

三、CSS代碼

.nav-wrapper{  // 頂部fixed佈局

}
.search-wrapper{  // 滾動區域的代碼
	position: absolute;
	left: 0;
	top: 88px;
	right: 0;
	bottom: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;  // 優化滾動效果
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章