body要素のスクロールバウンスを防ぎますが、iOSの子要素についてはそのままにします
私は最近モバイルWebアプリに取り組んでいます。私はモバイルファーストを最適化しており、今は特にiPhone用のiOSに焦点を当てています。ネイティブアプリの正確な外観は必要ありませんが、ネイティブであることのfeelingは絶対的に重要だと思います。このアイデアを反映するためにマークアップとCSSを作成しましたが、これは残しておきます（後の問題をよりよく理解するために注釈を付けました）。
これはすべて問題なく機能し、静的なヘッダーとフッター、およびスクロール可能な内部ビュー（-webkit-overflow-scrolling: touchのおかげ）を備えたネイティブな感覚を持つという利点もあります。
IOSを5分以上使用している人なら誰でも知っているように、上下にスクロールすると、素敵な勢いのスクロールが得られます。また、リストの先頭に到達すると、ニースの「バウンス」効果が得られます。
これはiOSのフィーリングを定義するのに役立ち、そのような小さな詳細は大いに役立つと思います。幸いなことに、webappのスクロール可能な要素のリストの最上部の下にいて、最上部を過ぎてスクロールすると、同じ効果が得られます。これは、望ましい動作です：
ただし、リストの一番上にいて、リストの一番上で同じバウンド動作を再現しようとすると（上記のSetting.appのように）、次の動作が得られます望ましくない： 
Stack Overflowで similarquestions を見ましたが、これらはすべてバウンスを無効にすることを選択しています。バウンスを続けることが可能かどうか疑問に思っていますが、webappのchromeではなくbody section section#mainで常に発生するようにします。私はjQueryを使用していないので、答えはまっすぐなJavaScriptにすることをお勧めします（ただし、CSSソリューションのボーナスポイント）。
GitHub repo すべてのコード（Sinatra、HAML、およびSass。現在のブランチはso）です。または JSFiddle は壊れた画像とリンクです、ただし、iPhoneで問題の問題を示しています（テストするにはホーム画面に追加するのが最適です）。
古い情報：これを解決しました： http://www.hakoniemi.net/labs/scrollingOffset/nonbounce.html =
新しい情報：これはここからjQueryプラグインになります： http://www.hakoniemi.net/labs/ nonbounce / 。
いくつかの問題があります、これが適用されるとズーム機能を失う、または動的更新が流fluentに機能しないなどです。
しかし、今最も簡単な方法は、定義することです：_<div class="nonbounce">...</div>_そして$.nonbounce();
私は同じ問題に遭遇し、この解決策を思いつきました：
http://demo.josefkjaergaard.com/stackoverflow/element_scroll/index.html
基本的に、スクロールコンテンツが最大位置にならないようにします。これにより、ボディスクロールがアクティブになりません。
動作しますが、イージングの最後に少しスナップを作成します。もう少し作業を行うと、コンテンツを反対方向にオフセットすることにより、この動作をおそらく隠すことができます。
この擬似コードはどうですか：
document.body.addEventListener("ontouchstart", function(event) {
if(document.getElementById("main").scrollTop > 0) return;
event.preventDefault();
event.stopPropagation();
}, false);