Question

如果scrollTop有一定值，我想设置一个样式。如果已设置样式，则代码不应再次运行。我怎样才能以有效的方式实现它？

$(window).scroll(function() {
    var scrollTop = $(window).scrollTop();
    if (scrollTop >= winH) { 
        $('box').css({ 'position':'absolute', 'top': winH });
    }
});

Answer 1

在应用该样式时，可以使用变量设置为true，例如

var scrolled = false;
$(window).scroll(function() {
  var scrollTop = $(window).scrollTop();

  if (!scrolled && scrollTop >= winH) { 
    scrolled = true;
    $('box').css({'position':'absolute','top': winH});
  }
});

或者更好的是，你可以取消绑定处理程序，例如

$(window).on('scroll', function() {
  var scrollTop = $(window).scrollTop();

  if (scrollTop >= winH) { 
    $('box').css({'position':'absolute','top': winH});
    $(window).off('scroll');
  }
});

无论如何

1）您可以使用position: fixed，或者在较新的浏览器上使用position: sticky（如果是这种情况，我不知道您要实现的目标）

2）在scroll事件上连续调用处理程序不是一个好主意。请考虑使用超时（请参阅http://ejohn.org/blog/learning-from-twitter/）定期检查您的滚动顶部位置

如果尚未设置样式

1 个答案: