JavaScriptで水平スクロールを無効にする

Question

JavaScriptを使用して水平スクロールバーを無効にする方法があるかどうかは知りませんか？

私はoverflow-x: hidden;を使用しません。

Answer 1

CSSプロパティを完全に有効にしないと、スクロールバーやJavaScript、HTML/CSSデザインを必要としないようにコンテンツのサイズを変更できます。

あなたもこれを行うことができます：任意のスクロールを検出し、自動的に左上/へのスクロールを返します

window.onscroll = function() { 
window.scrollTo(0,0); 
} 

...。このようなことをすることは、ユーザーを苛立たせることになることに言及しています。

不要なUI要素がまったく存在しない環境（CSS、デザインを通じて）を作成すると、最も効果的です。上記のアプローチでは、不要なUI要素（スクロールバー）が表示され、ユーザーが期待するように動作しないようにします（ページをスクロールします）。あなたはユーザーと "契約を壊した" - ユーザーが慣れ親しんだ行動を取ったときに、残りのWebサイトやアプリケーションが期待したことをどのように行うことができるか、どのように信頼できるか？

Answer 2

のjQueryでスクロールダウンから要素を防ぐ方法：

$(element).scroll(function() { 
    this.scrollTop = 0; 
    this.scrollLeft = 0; 
}); 

まあ、これは実際にスクロールを防ぐことはできませんが、に似た要素の左上隅に、それは「バックスクロール」、 Chrisのソリューションで、単一の要素の代わりにウィンドウ用に作成されたものです。必要に応じてscrollTopまたはscrollLeft行を削除します。

Answer 3

スクロールバーが重複しています（http://jsfiddle.net/dJqgf/）。

var overlap = $('<div id=b>'); 

$("#a").wrap($('<div>')); 

$("#a").parent().append(overlap); 

：

#a { 
    width: 100px; 
    height: 200px; 
    overflow-x: scroll; 
} 

#b { 
    position: relative; 
    left: 0; 
    bottom: 20px; 
    width: 100%; 
    height: 20px; 
    background-color: white; 
}