最近良く見かけるモーダルウィンドウですが、 モーダルのサイズが大きいと画面外にはみ出してしまい、全てを表示することが出来ません。 スクロールしたとしても、モーダルの背景であるメインコンテンツがスクロールされてしまいます。 そこで、モーダルが表示されている間のスクロール対象を、背景のメインコンテンツではなく、 モーダル自身に与えてあげることで、画面外に広がったモーダルコンテンツを全て表示することが可能です。 今回は、そんなスクロール可能なモーダルを手軽に構築する方法を解説します。 また、そんなモーダルをスクロール可能にする一連の処理を jQueryのプラグインとして作成しましたので、宜しければお使い下さい。 一般的なモーダルの実装 一般的なモーダルの問題点 大きいモーダルを扱うサイト スクロール可能なモーダルの考え方 jQueryモーダルプラグインの使い方 jQueryモーダルプラグインのソ
![サイズの大きなモーダルをスクロール可能にする方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/ccfe50e92840dfbd8a4a791e30644d5afcff7a80/height=288;version=1;width=512/https%3A%2F%2Fblogger.googleusercontent.com%2Fimg%2Fb%2FR29vZ2xl%2FAVvXsEgcMQUFNRS3dNmyEYhWpvadUvZJicE-U1RRRNiaWt_cJKOvBAkYBoeO9sO6iZNJSBDj1shkd4p0WR5h3W-KI_3l4nzmnq9Z7NoJRot2M-n-TXxU6nrJ9CSQU1buY57MA1r2MyV0y-Q6uA%2Fw1200-h630-p-k-no-nu%2FOOK89_kabanni5000mannante20131223.jpg)