テスト期間 - スクロール アンカー

ウェブページにアクセスしてコンテンツの一部を読み始めたところ、広告や画像の読み込みによってページがポップアップ表示され、ページ内の位置が分からなくなったことはありませんか?

Chrome 51 の Scroll Anchoring フラグを確認することをおすすめします。

スクロール アンカーは、ページ上の現在地を追跡し、リフローの原因となるものがページ上の位置を乱すことを防ぎます。

この機能を試すには、次の手順を行います。

  1. Chrome Dev / Canary で chrome://flags/#enable-scroll-anchoring に移動します。
  2. プルダウンから [有効] を選択します。
  3. 画面下部の [今すぐ再起動] をクリックします。

これにより、スクロール アンカーが有効になります。

Google ではこの技術を長い間使用しており、ウェブ上のすべてのユーザーにとってエクスペリエンスが大幅に向上すると考えていますが、すべての環境で確実に機能するようにしたいと考えています。スクロール アンカーがページのリフローを処理できなかった例や、介入すべきでなかった例を見つけた場合は、ぜひお知らせください

予期しない動作が発生した場合は、g.co/reportbadreflow のフォームに記入してフィードバックをお送りください。

よくある質問

この変更は JavaScript のスクロールにどのような影響がありますか?

簡単に言うと、できません。

この変更により、再フローの原因となるスクロールの効果が変化します。たとえば、要素にクラス名を追加して高さを増やすと、再フローがトリガーされ、スクロール アンカーリングによってページがジャンプするのを防ぐことができます。

window.scrollTo(0, 1) を呼び出す(古いハックです)と、再フローは発生せず、正常に動作します。タッチイベントも同様です。

スクロール アンカーがページに影響している例を見つけた場合は、g.co/reportbadreflow のフォームからフィードバックを送信してください。