ホームページ > ウェブフロントエンド > htmlチュートリアル > マスクレイヤーの背後でページがスクロールしないようにする方法

マスクレイヤーの背後でページがスクロールしないようにする方法

黄舟
リリース: 2017-10-24 10:36:01
オリジナル
2454 人が閲覧しました


1: ページは先頭に初期化されて停止します
CSS コード:

.ovfHiden{overflow: hidden;height: 100%;}
ログイン後にコピー

jquery:

$(".header_right").click(function(){$('html,body').addClass('ovfHiden'); //使网页不可滚动
   $(".searchbox").show();
 })
 $(".yg-close").click(function(){
   $('html,body').removeClass('ovfHiden'); //使网页恢复可滚
   $(".searchbox").hide();
 })
ログイン後にコピー

2: ページは通常どおり停止します
1. 新しいページを開くときは、無効にする必要があります。マウスホイールとページスライド;
表示レイヤーを呼び出すときに次のjsコードを追加するだけです:

document.documentElement.style.overflow = "hidden";
ログイン後にコピー


レイヤーを閉じるときにこれを追加することを忘れないでください:

document.documentElement.style.overflow = "scroll";
ログイン後にコピー



2.スクロールホイール

var top_temp = $(document).scrollTop()||document.documentElement.scrollTop || document.body.scrollTop;
window.parent.scrollTo(0,top_value);
ログイン後にコピー

以上がマスクレイヤーの背後でページがスクロールしないようにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート