私は次の構造を持っています：
<div id="parent">
content 1
<div id="child1">
content2
<div id="child2">
content 3
</div>
</div>
</div>
3 つの要素すべてについて、overflow-y: scroll と -webkit-overflow-scrolling: touch; を使用しています。それぞれに、コンテンツがその中にオーバーフローする特定の高さがあります。
これが必要な理由は、主にモバイルでの使用です。私がする必要があるのは、各コンテンツの親要素が下端に達したときにスクロールしないことです。通常の動作では、子 2 要素が一番下までスクロールすると、子 1 がスクロールを開始し、下に到達すると親がスクロールを開始します。いくつかのスクリプトを使用しましたが、どれも正しく機能していないようです。
これは、モバイルとデスクトップの両方で使用したいと考えています。マウスホイール、キー、タッチアクションを防ぐために何かをしなければならないことは知っていますが、それを実装する方法がわかりません。
私は一週間ほど頭を叩いてきましたが、結果はありません。どんな助けでも大歓迎です！