移動端末を非表示スクロールバー、CSS方式

  初めての白は自分の問題を記録した文書を発行しました。

  モバイル側は多くの方法で、スクロールバーを非表示に、ちょうど私が使用したことをここに言います。

  PC側では右側のhtmlのデフォルトのスクロールバーを非表示にします

HTML {
        / *非表示のスクロールバーオーバーフローIEは、あなたはまだスクロールすることができます* /
        -ms-オーバーフロースタイル:なし。
        / * Firefoxの下のスクロールバーを非表示にします* /
        スクロールバーの幅:なし。
    }
  / *スクロールバーが非表示になっているの下にクロムは、オーバーフローが透明にスクロールすることができ* /
HTML ::  -  WebKitの、スクロールバー{幅:0PX}

  FirefoxとIE /エッジスタイル内のすべての隠されたページのスクロールバーを行います。Chromeは右側のみのデフォルトのスクロールバーを隠し、あなたはラベルスタイルのスクロールバー内で非表示にするだけでは与えられるべきである:: - webkitの-スクロールバー{幅:0PX}。

 最後に移動するには、スクロールバーを非表示にします

  Firefoxのスタイル上のIEがまた、モバイル端末で使用することができます。しかし、Chromeはそうではありません。

  スタイル:WebKitの-スクロールバー{0PX幅を} - ここで私は唯一の私が道を使用すると言うことができ、クロム移動端末は::使用することを望んでいます。私たちは、HTML、ボディの幅と高さを設定する必要があります

 

HTML、本体{幅:100%。高さ:100%; オーバーフロー:スクロール;}
HTML :: -webkit-スクロールバー、ボディ:: - webkit- スクロール{幅:0PX;高さ:0PX;}
本体{マージン: 0;}

スクロールバーの右に終わるだろう、このような動きは、デフォルトでは非表示になっています。スタイル上記の設定せずに、することができ:WebKitの、スクロールバー{0PX幅} - あなただけ非表示にした場合、スクロールバーはスタイルだけでは::に与えられたラベルに表示されます。

携帯端末本体{高さ:100%、幅:100%}、また欠点を有し、これはスクロールバーdocument.body.scrollTop、window.pageYOffset圧延距離取得が失敗原因となります。私は後で解決策を公開します。

唯一の3つのモバイルブラウザをテストし、Baiduのブラウザクローム方法を非表示にすることができます。そのメソッドを使用してPC側でのFirefox。Huawei社の携帯電話は、ブラウザが付属して、完全にFirefoxのスタイルで、クロームで非表示にすることができます方法はスライドの右側を隠すことができますが、ブラウザの上下の矢印スライダーを隠すことができません。

スクロールバーの問題もいくつかのプラグインを解決することができます。私はまだ、言及することは、あなたが他の誰かの記事を閲覧することができ、一時的ではない、使用していません。

 

おすすめ

転載: www.cnblogs.com/ayyay/p/11757470.html