web-dev-qa-db-ja.com

iOSでの位置固定要素のスクロールの問題

私は、固定として配置された要素を持ついくつかのモジュールを持つモバイルプロジェクトを構築しています。直面している問題は、iOSで実行されているブラウザーでのみ発生します。正確な問題は、下部のツールバーが固定されているなど、ページの本体をスクロールするたびにスクロールすると、固定要素全体がそれぞれスクロールと一緒に移動し、スクロールが完全に終了すると、それだけに戻ります割り当てられた場所。

ページの本文に相対的なCSSルールを指定しました。これはiOSでのみ発生するため、助けてください。

 .add-to-block {
    background: #fff;
    position: fixed;
    bottom: 0px;
    right: 0px;
    display: block;
    height: auto;
    width: 100%;
    *(inner content element) {
        inner content element styling...
     }
}
ioscssscrollcss-positionfixed
19
Aman Pandey

これを試してください、ソース ここ

    .add-to-block {
        transform: translate3d(0,0,0);
        .....
        .....
    }
9
Abed Putra

これはiosの既知の問題である（おそらくios8で修正されている）ため、これに対する簡単な答えはありませんが、これは修正するいくつかの方法を提供します。 https://remysharp.com/ 2012/05/24/issues-with-position-fixed-scrolling-on-ios iosデバイスで修正された位置に関するすべての問題と、それを使用する必要がある場合に修正する方法の詳細。

3
Steven Hoskins

提案された解決策はどれもうまくいきませんでしたが、スクロールdiv内に固定要素があり（それを上に移動しました）、親要素に変換やその他のレイヤー作成プロパティがありませんでした（そして固定要素にレイヤーを作成しました）など。

私の解決策は、固定要素をposition: sticky;に変更することでした

0
tuberains