CSS Fixedしたコンテンツでスクロールさせたい - かもメモ
モバイルのメニューとかposition: fixedでデザインしたけど、メニューが長かったりデバイス回転させたりしたらメニューが見切れるからfixedしたモーダル内でスクロールを表示させたい時の実装方法のメモ top, left, right, bottom と overflow を利用する .modalNav { position: fixed; top: 0; left: 0; right: 0; bottom: 0; overflow-y: auto; } position: fixedと一緒に top: 0, bottom: 0, left: 0, right: 0 を使用するとコンテンツがエリア全体に伸びるので、そこにoverflowの指定があればfixedしたコンテンツであってもスクロールを表示させることができるようです。 縦方向のスクロールを発生させるだけならtop: 0;と
モーダルを表示したときに背景部分はスクロールできないようにする - Qiita
モーダルを表示させたとき、何も考えずにコーディングするとモーダルをスクロールしたいのに背景までスクロールされちゃう、 なんてことに陥りがち。 (モーダルの上端・下端を超えるスクロールをしたときや、モーダル外にカーソルを置いてスクロールしたとき等) これを防ぐには、モーダルが表示されているときは背景要素をfixedにするのが良さげ。 <div id="wrapper"> <p class="open"> <button>open modal</button> </p> </div> <section id="modal"> <!--modal content --> </section> // include jQuery var current_scrollY; // OPEN MODAL $( '.open button' ).on( 'click', function(){ curre
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
