【CSS】iOSでの入力ボックスの互換性の問題を修正

必要:

単純な要件を達成するために、上部は検索ボックスで上部は固定、下部はスクロールするコンテンツ リストです。
ここに画像の説明を挿入

質問 :

図に示すように、上部に固定位置、下部にスクロールビューを使用する場合、Android では問題ありませんが、iOS では互換性の問題が発生することがわかります。

質問1: コンテンツリストを中央までスクロールして検索すると、表示された検索コンテンツが検索ボックスの下ではなく上部に押し出され、再度検索ボックスをクリックしても応答がありません

理由:この時点ではコンテンツ一覧が途中までスクロールされており、検索完了後は元のスクロール位置からコンテンツ一覧の位置が計算されるため、検索ボックスの下に検索されたコンテンツが表示されません。

質問 2: コンテンツ リストを一番下までスクロールしてから検索すると、ページが空白で表示され (実際にはデータが返されます)、検索ボックスやその他の要素を再度クリックしても反応しません

理由は不明〜

解決 :

jsを使用して中央の高さを計算します contentHeight = pageHeight - searchHeight
コンテンツをscroll-yにスクロールします:自動

完璧なソリューション〜
ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/qq_45481971/article/details/132047692