我创建了一个固定在页面底部的页脚。当用户向下滚动时,页脚边距底部更改为 20px,颜色从黑色变为白色。在这里,我使用了以下 jQuery:
$(document).ready(function() {
$(window).scroll(function() {
var $this = $(this);
if ($this.scrollTop() >= 10) {
$("footer").animate({
marginBottom: "30px",
backgroundColor: "fff"
}, 2000);
}
});
});
当用户滚动回顶部时,页脚应返回到屏幕底部,颜色应再次从白色变为黑色。我尝试使用 else 语句,但没有成功。
找到它:
$(document).ready(function() {
$( window ).scroll(function() {
var $this = $(this);
if ($this.scrollTop() <= 5) {
$("footer").stop().animate({marginBottom: "0px", color: "fff", backgroundColor: "000"}, 1000);
} else if ($this.scrollTop() >= 5) {
$("footer").stop().animate({marginBottom: "30px", color: "000", backgroundColor: "fff"}, 1000);
}
});
});
最佳答案
如果可行,试试这个:
.footerback{
margin-bottom:0;
background-color:#000000;
}
$(document).ready(function() {
$(window).scroll(function() {
var $this = $(this);
if ($this.scrollTop() >= 10) {
$("footer").animate({
marginBottom: "30px",
backgroundColor: "fff"
}, 2000);
}
else{
$("footer").addClass("footerback");
}
});
});
关于jQuery:滚动后恢复为默认值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24849298/