オリジナルリンク:Fyerlのブログ
一般的なヘッダ天井、通常固定位置決めを実現することができ、地図上の同様のそのような「粘着性シーリング」は、より一般的な要件であります
おそらく考える「スティッキー天井は」これです:まず、天井バー絶対的または相対的な位置に、とき視野領域の天井からの高さjsのイベントをスクロールして聞いては、高さの天井の判定バーの機能をトリガー固定ターゲティングにそれを交換する未満又は0に等しいの上面、および絶対または相対ゼロよりも大きいバックを置き換え
その他のPC側のアイデアや終わりアンドロイド可能ですが、iOSでは、機能の高さを決定しますが、スクロールイベントで毎回トリガされたが、唯一の停止をスライドした後、この機能を起動しません
この変更は、iOS8に作られていることを知らされ、「iOSのonscrollイベント遅延」それをグーグルウェブページをスクロールしたとき、およびないJSトリガの実行
//developer.telerik.com / ...:HTTP
ここでは、私はちょうどあなたが引き金をスクロールする必要がある場合は、それが唯一のネイティブのiOSスクロールを交換するiSroll他のサードパーティ製のライブラリを使用することができ、他のロジックコード天井効果を実装し、ないようにする必要があります
戻る天井問題に彼が追求し、見つかったので、サードパーティ製のライブラリのコストの導入少し大きい効果にために、今まで知っていたが、名前が示すように、positionプロパティの粘着性に注意を払っていない、この属性の役割は、理論的には、粘着性がありますあなたはJSによる「スティッキー天井」を達成することができるようにする必要はありませんが、PCとAndroid、互換性も悪く、の不十分なパフォーマンスのモバイル最後に、このプロパティは、しかし、そして最後にiOSのは、iOS6非常に良いです。システムは、1以上をサポート
最終的な解決策があるので:
それは定期的にイベントや使用の固定位置をスクロールして聞いて、Androidのであればまず、現在のシステムを決定し、iOSのは、粘着性のポジショニングを使用します。
//Android
.tab-box-fixed {
position: fixed;
z-index: 5;
}
//iOS
.tab-box-sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
left: 0;
z-index: 5;
}