Question

制作一个在滚动后调整大小的标题，当我向下滚动时我的工作方式，然后当我一直滚动到顶部并尝试让标题再次变大时失败。有时它会调整大小，有时它会胜出;而且它从来都不是即时的。

以下是代码：

$(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);
}});

提前致谢

Answer 1

你需要有一个标志，检查是否完成了同样的事情。以下代码中可能存在故障，但需要在适当的环境中进行调整。如果需要，请将第一行更改为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;
    }
  }
});

在此处设置此flag将确保该函数在其范围内仅执行一次。

$（窗口）.scroll事件触发不一致

1 个答案: