この記事 のAndroid版です。
一昔前はページスクロール中はJSが止まってしまうことがあたりまえだったスマートフォンのブラウザ。
なのでスクロール連動のサイトとかを実装するときはいろいろ大変でした。(自前でスクロールを実装したりしてました)
しかし、最近のブラウザはスクロール中にもJSが動くようになり一安心。だと思っていたのですが、最新の環境のみ対応すればいいわけではないので、手元にあるAndroidで調べてみることにしました。
検証方法
スクロール中にsetIntervalが動くか確認
- こちらのコード をブラウザで開く
- ページをスクロールしながら観察する(タイマーによって数字がカウントアップしていくことを期待)
スクロール中にscrollTopが更新されるか確認
- こちらのコード をブラウザで開く
- ページをスクロールしながら観察する(リアルタイムにスクロール量が更新されることを期待)
- ついでにscrollTopに負の値が入るのかのも確認
グラデーションがかかるか確認
- 完全についでなんですが、上記URLで背景にグラデーションがかかるかも見てみました。
検証結果
IS11S (Android2.3.4)ブラウザ
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かからない
F-11D (Android4.0.3)ブラウザ
スクロール中にsetIntervalが => 動かない...
スクロール中にscrollTopが => 更新されない...
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かからない
SH-01F (Android4.2.2)ブラウザ
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かからない
SO-03F (Android4.4.2)ブラウザ
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かからない
SO-03F (Android4.4.2)Chrome
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かかる!
Nexus5 (Android5.0.1)Chrome
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かかる!
Nexus5X (Android6.0)Chrome
スクロール中にsetIntervalが => 動く!
スクロール中にscrollTopが => 更新される!
scrollTopに負の値が => はいらない(0以下の数は0になる模様)
グラデーション => かかる!