2

私はモバイルデバイスで「position：fixed」が欲しかった（私はAndroidを持っている）-そしてこれは存在しない。
2つのdivを作成し、その高さを合計して画面の高さにし（JSを使用）touch、下部のdivにリスナーを追加して偽造しました。イベントはscrollTop値を調整します。これは古い「touchScroll.js」のコピーでした。

スクロールはうまく機能し、スリングの感触も追加しました。ただし、OSがウィンドウのビューをスクロールする場合と比較すると、スクロール全体が非常に途切れます。

私はランダムな場所で読んだことがあり、このチョップを解決するためにビットを追加-webkit-backface-visibility:hidden;して-webkit-transform:translate3d(0,0,0);cssするためにここのどこかにあります。私はそれをdiv自体、ボディ、背面部分のみ、変換のみなどで試しました...すべての順列...何も役に立ちませんでした。inputチョップはまだ存在していました、そしてトリックは私のキーボードがsに現れるのを止めました

スクロールしているものの中に内部divを作成しようとしましたが、値を調整する代わりに、内部divを作成して調整scrollTopするだけで移動しました。これは何の違いもありませんでした。position:absolutetop

チョップを打ち負かす解決策はありますか？
例はここにあります：http：//mobile.phantasyrpg.com/so-example

4

2 に答える 2

1

残念ながら、これに対する解決策はないかもしれません。Androidブラウザはレンダリングパフォーマンスが低いことで知られています。Androidのバージョン/デバイス/ブラウザの組み合わせが異なれば、パフォーマンスと互換性も異なります。実際のところ、例はAndroid 4.0.4 Chromeで非常にスムーズに実行されますが、ファクトリブラウザでは機能しません。

変換はハードウェアアクセラレーションであることが多いため、原則として、常にCSS変換を使用し、他のプロパティ（scrollTopなど）の後でのみ使用してください。（iOS Mobile Safari、および最新のAndroidブラウザーの場合と同様）。

TouchScrollまたはiScrollの最新バージョンを試してみることをお勧めします。どちらもCSS変換を使用しており、他の最適化も含まれている可能性があるためです。

この-webkit-transform:translate3d(0,0,0);設定は通常、ハードウェアアクセラレーションを実施するために使用され、変更/移動する要素（この場合はコンテンツdiv）で使用する必要があります。ただし、新しいバージョンのスクロールライブラリを使用すると、-webkit-transformとにかくプロパティが上書きされます。が要素にも適用されている-webkit-backface-visibility場合にのみ適切であり、これを設定すると、不要なちらつきが解決されたり、場合によってはパフォーマンスが向上したりする可能性があります。-webkit-transformhidden

于 2012-07-06T23:49:43.503 に答える
0 
-webkit-overflow-scrolling: touch;

物事をスムーズにするはずです。古いAndroidで動作するかどうかは不明

于 2012-07-07T00:05:37.590 に答える