モーダル内でのスクロール設定

モーダル内でスクロールを有効にすることで、多くの情報を1つのモーダルにまとめて表示できます。例えば、お問い合わせフォームや利用規約などの表示で利用すると閲覧者はページを移動することなく、その情報が閲覧できます。

エディタ右上のページ追加ボタンから、モーダルを新規作成します。

モーダル内に画像やテキストなどのコンテンツを追加します。

コンテンツが内包されるボックスを選択し、画像のように整列を「上揃え」、方向を「下」に設定します。

同じボックスを選択したまま、はみ出しを「スクロール」に設定します。

※スクロールバーは確認用としてエディタでのみ表示されます

モーダルを開くリンクと閉じるボタンの設定を行います。詳しい手順は、モーダルへのリンク設定方法 | STUDIO U をご覧ください。

ライブプレビューで、スクロールの動作を確認します。

モーダルの縦幅が「auto」や「flex」になっていると、スクロールが動作しません。縦幅をご確認いただき、「px」や「％」などの単位に変更してください。