目的は、ウィンドウがスクロールされたときに(固定配置された)ヘッダーの下部に影を追加することです。しかし何らかの理由で、このコードは動作していないようです。スクロールすると何も起こりません。どんな助けもありがとう。スクロール時にヘッダーの下部に影を付ける
CODE
Javaスクリプトは、私のHTMLドキュメントのヘッド部分に書かれています。あなたのコードで
<script>
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll > 0) {
\t $("#header-home").addClass("shadow");
}
else {
\t $("#header-home").removeClass("active");
}
});
</script>
#header-home{
position:fixed;
width:100%;
top:0;
left:0;
background-color:#fff;
z-index:900;
}
.active {
box-shadow: 0 4px 2px -2px #f1f1f1;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<body>
<header id="header-home">
<!-- header content here -->
</header>
あなたはクラス 'shadow'を追加しますが、あなたのCSSには、すでにコメントで述べたよう名前がタイプミス間違い –
投票active''であるのです。コメント、特に他の人のコメントの回答をする必要はありません。 – vsync