2

我的问题是关于使用 .offset() 查找浏览器的 y 位置，并且在某一时刻我想向我的 div 添加类我想创建类似yourkarma.com的东西（查看 WHAT IS POWERING IT 部分）

$(document).ready(function() {
    $(window).scroll(function (event) {
    // what the y position of the scroll is
    var z = '150';
    var x = $('#thisdiv').offset().top - z;
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y >= x) {
      // if so, ad the fixed class
      $('#thisdiv').addClass('red');
    }
  });
})

我走对了吗？我觉得使用 z=150 并将其减去 X 是一种便宜的方式。无论如何，有没有做一个更好的？

4

1 回答 1

1

这并不便宜，但也许更清晰有效的方法是：

var $thisdiv = $('#thisdiv');
var thisdiv_top = $thisdiv.offset().top - 150;
var thisdiv_flag = false;

$(window).scroll(function (event) {
    if(thisdiv_flag) return;

    // what the y position of the scroll is
    var y = $(window).scrollTop();

    // whether that's below the form
    if (y >= thisdiv_top) {
        // if so, ad the fixed class
        $thisdiv.addClass('red');
        thisdiv_flag = true;
    }
});

我不确定为什么是-150。我想所以它会在元素出现之前触发一点。但是这段代码效率更高一些。它为 div 缓存 jQuery 对象并设置一个标志，这样事件就不会再次触发。它还避免了每次用户滚动时都必须进行相同的偏移计算。

希望这可以帮助。

于 2013-03-14T02:35:02.270 回答