私はjqueryと苦労してきたdivをクリックしてページをカバーすると仮定している。私はトップページ（高いz-インデックス、不透明度とvualaのビット）で全ページをカバーする方法を知っている、私はボタンを持っていますが、クリックしたときにそれを動作させる方法。https://jsfiddle.net/4uu8Lkdt/8/は助けに感謝します。私はやってみたjqueryとカバーdivを作成するすべてのコンテンツの上に行く
$('#id').click(function() {
$('#id').toggleClass('cover');
document.getElementById("cover").style.zIndex = 1;
});
しかし、私はこのウェブサイトの開発とjavascriptもので新しいです。ここで
はjQueryのを含め、あなたのコードのための小さな編集（質問はそれのためにタグ付けされている）である：カバーのための
https://jsfiddle.net/4uu8Lkdt/9/
if (this.classList.contains("is-active") === true) {
$('body').append($('<div class="cover">'));
} else {
$('.cover').remove();
}
新しいCSSクラス：
.cover {
width: 100%;
height: 100%;
position: absolute;
z-index: 11;
opacity: 0.5;
background-color: white;
}
私が推薦しますコードをjQueryに相当するものに変更しました。開発する方がはるかに簡単です。
うわー...基本的には、「toggleclass」ではなくボタンコードのコードをいくつか含んでいました。そのカバーの「ページ」をクイックメニューとして使用するので、簡単なナビゲーションを追加する必要があります。ページの表示と非表示に問題がありますか？また、カバーをスムーズに、ゆっくりと、二番目に何かに入れることが可能ですか？ –
jQueryですべて可能です。特に超初心者の方には使い方が簡単です。 http://api.jquery.com/には多くの例がある素晴らしいドキュメントがあります。 – Tyr
チェックそれはここhttps://jsfiddle.net/4uu8Lkdt/13/
このjQueryのは
$('.c-hamburger').on('click', function(){
$('.cover').toggleClass('is-active');
});
CSSが更新され
編集。
これは必ずしもあなたの疑問に答えるわけではありませんが、異なるスタッキングコンテキストが存在する可能性があるため、z-indexの仕組みを読み解く価値があるかもしれません。 http://philipwalton.com/articles/what-no-one-told-you-about-z-index/ –
リンク先のコードには、IDが「id」の要素は含まれておらず、 CSSクラスの 'cover'を定義しました。 –