我有一个基本的 HTML,我正在创建一个新类(原始滚动),它将在我开始滚动时将固定位置添加到我的菜单。
HTML
<header class=" original">
<h1>This is a Sticky Nav Demo!</h1>
<p>MAIN MENU</p>
</header>
<div class="main">
<h2>Lorem ipsum dolor sit amet</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean fringilla, </p>
CSS
.original {
height: 100px;
padding-top: 20px;
background: #f07057;
}
.original-scrolled {
position: fixed;
width: 100%;
top: 0;
}
jQuery - 这是我正在使用的函数,但它似乎不起作用!
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 90) {
$(".original").addClass(".original-scrolled");
} else {
$(".original").removeClass(".original-scrolled");
}
});
我是初学者,如果这段代码很乱,我很抱歉!
最佳答案
您添加和删除类的方式是错误的。 这应该有效:
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 90) {
console.log("more than 90");
$(".original").addClass("original-scrolled");
} else {
$(".original").removeClass("original-scrolled");
}
});
您在添加和删除类名称时指定了类选择器。 你应该看看 api here
关于javascript - 为什么我的代码 (jQuery) 没有响应?目标 : Sticky header,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33979908/