制作一个在滚动后调整大小的标题,当我向下滚动时我的工作有效,然后当我一直滚动到顶部并尝试让标题再次变大时失败。有时它会调整大小,有时不会;而且它从来都不是即时的。
代码如下:
$(window).scroll(function () {
if ($(document).scrollTop() >= 50) {
$('.header').animate({
'padding': 0
}, 300);
} else {
$('.header').animate({
'padding-top': 15,
'padding-right': 7,
'padding-bottom': 15,
'padding-left': 25
}, 300);
}});
提前致谢
最佳答案
你需要为此设置一个标志,它检查是否已经完成了同样的事情。以下代码可能存在问题,但需要在正确的环境中进行调整。如果需要,将第一行更改为 true
。
var flag = false;
$(window).scroll(function () {
if ($(document).scrollTop() >= 50) {
if (flag) {
$('.header').animate({
'padding': 0
}, 300);
flag = false;
}
} else {
if (!flag) {
$('.header').animate({
'padding-top': 15,
'padding-right': 7,
'padding-bottom': 15,
'padding-left': 25
}, 300);
flag = true;
}
}
});
在此处设置此标志
,将确保该函数在其范围内仅执行一次。
关于javascript - $(window).scroll 事件触发不一致,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34981513/