スクロール管理

スクロールのリセット

ページ間を移動する際、Inertia はデフォルトのブラウザ挙動を再現し、ドキュメントボディ（および定義した任意のスクロール領域）のスクロール位置を自動的に先頭へリセットします。

さらに、Inertia は各ページのスクロール位置を追跡し、履歴を前後に移動する際にそのスクロール位置を自動的に復元します。

スクロールの保持

場合によっては、遷移時のデフォルトのスクロールリセットを防ぎたいことがあります。この挙動は、preserveScroll オプションを true に設定することで無効化できます。

レスポンスにバリデーションエラーが含まれる場合にのみスクロール位置を保持したい場合は、preserveScroll オプションを "errors" に設定します。

また、コールバックを渡すことで、レスポンスに基づいて preserveScroll オプションを遅延評価することもできます。

Inertia リンクを使用する場合、preserveScroll プロパティを使ってスクロール位置を保持できます。

スクロール領域

アプリがドキュメントボディのスクロールを使用せず、代わりに（overflow CSS プロパティを使った）スクロール可能な要素を使用している場合、スクロールのリセットは機能しません。

このような場合、scroll-region 属性を要素に追加して、どのスクロール可能な要素を Inertia が管理すべきかを指定する必要があります。

<div class="overflow-y-auto" scroll-region="">
    <!-- ページコンテンツ -->
</div>

テキストフラグメント

テキストフラグメントを使用すると、#:~:text=term のような特別な URL 構文で、ページ内の特定のテキストへ直接リンクできます。ただし、ブラウザは JavaScript が実行される前にフラグメントディレクティブを削除するため、テキストフラグメントは、対象のテキストが初期の HTML レスポンスに含まれている場合にのみ機能します。

Inertia ページでテキストフラグメントを使用するには、サーバーサイドレンダリングを有効にしてください。