修正パターン(body固定方式)

下のボタンで利用規約モーダルを開き、規約の本文を指でスクロールしてみてください。慣性スクロールも効き、背景も動きません。

このデモはtouchmoveのpreventDefaultを使わず、モーダル表示中だけbodyをposition: fixedで固定しています。モーダル内はネイティブスクロールのままです。iPhoneのSafariで確認してください。

セクション 1

ここは背景ページのコンテンツです。モーダル表示中はbodyごと固定されているため、モーダルの外をどれだけスワイプしてもこのページは動きません。モーダルを閉じると、開く前と同じスクロール位置に戻ります。

セクション 2

背景ページのダミーコンテンツです。ページに高さを持たせるために置いています。

セクション 3

背景ページのダミーコンテンツです。ページに高さを持たせるために置いています。

セクション 4

背景ページのダミーコンテンツです。ページに高さを持たせるために置いています。