Question

我是jQuery的新手并且不太了解它，所以我可能不会理解非常简单的东西。所以我为锚点链接创建了一个粘性导航，当用户向下滚动页面时会突出显示。为了创建这个，我使用了jquery waypoint.js，我目前正在使用它。我遇到的问题是我需要突出显示触发50px高于它的当前位置，所以在waypoint.js中有一个偏移选项，但我无法使代码工作。如何实现waypoint.js的偏移量？

感谢您的帮助！

//这是我需要在下面的代码中实现的航点的偏移代码 - 我如何在下面的代码中使用它？

var waypoint = new Waypoint({
  element: document.getElementById('number-offset'),
  handler: function(direction) {
  notify('25px from top')
  },
   offset: 25
})

//这是在nav元素上创建高光的代码

$(document).ready(function(){
    var waypoint0 = new Waypoint({
        element: document.getElementById('work'),
        handler: function() {

            $('a[href="#work"]').toggleClass('highlighted');
        }
    })
    var waypoint1 = new Waypoint({
        element: document.getElementById('about'),
        handler: function() {
            $('a[href="#work"]').toggleClass('highlighted');
            $('a[href="#about"]').toggleClass('highlighted');
        }
    })
    var waypoint2 = new Waypoint({
        element: document.getElementById('contact'),
        handler: function() {
            $('a[href="#about"]').toggleClass('highlighted');
            $('a[href="#contact"]').toggleClass('highlighted');
        }
    })   


  });

Answer 1

似乎你只需要添加＆＃34;偏移＆＃34;属于那些现有的航点声明。

电流：

  var waypoint0 = new Waypoint({
    element: document.getElementById('work'),
    handler: function() {

        $('a[href="#work"]').toggleClass('highlighted');
    }
  });

新：

  var waypoint0 = new Waypoint({
    element: document.getElementById('work'),
    handler: function() {

        $('a[href="#work"]').toggleClass('highlighted');
    },
    offset: 50
  });

来源：http://imakewebthings.com/waypoints/api/offset-option/

如何实现偏移到jquery的航点代码？

1 个答案: