TL; DR: iOS で modal を表示しても、body が相変わらずスクロールできるの修正方法:modal-open クラスに positive: relative を追加すれば、修正されます。
Bootstrap などを使うと、簡単に Modal ウィンドウが作れるようになります。基本的に CSS もあって、関数を呼び出すだけです。そのモーダルウィンドウは一般的に画面の真ん中に、スクロールできないようになっています。これは modal-open というクラスを body tag に設定することで、body の overflow を hidden に設定するだけでできています。
そうすると、モーダルウィンドウ自身はスクロールできるし、いつも画面の真ん中にあります。ユーザーに操作を提示しているため、最適していると思います。
iOS 9 がリリースされて、一つの問題は発生しました。body のスクロール禁止が効かなくなりました。
対応方法としては
modal-open { overflow: hidden; position: relative; }
にして、元と同じように動きます。PC ではこの問題が起きません。
他の修正方法としては、html, body と一緒に overflow: hidden を設定します。
それでは。
0 件のコメント:
コメントを投稿