使用jquery航路点向上滚动

我正在使用jquery waypoints插件创建一个单页滚动站点。有一个固定的顶部菜单

<ul id="main_nav">
  <li><a href="#home">home</a></li>
  <li><a href="#about">about</a></li>
  <li><a href="#contact">contact</a></li>
</ul>

---

答案就在你的代码里。函数回调中的

direction

变量被传递一个“up”或“down”字符串。你有向下方向的代码，但你也应该为向上方向做些事情

if (direction === 'down') {
  // Your current code
}
else {
  // Code to select the previous section
}

---

看看偏移选项

someElements.waypoint(function(event, direction) {
   if (direction === 'down') {
      // do this on the way down
   }
   else {
      // do this on the way back up through the waypoint
   offset: '50%'  // trigger at middle of page.

   }
});

以下是一个例子：

$('.page_content').waypoint(  
    function(direction) {

        if (direction ==='down') {
            $(this).fadeTo(1000, 1);
        }
        else {
                $(this).fadeTo(1000, 0);        
        }

    }, { offset: '50%' });

这使得对象在向下滚动时可见，在向上滚动时消失

---

偏移用于确定动画将从何处开始。默认偏移量为0%，这意味着当对象的顶部碰到浏览器顶部时动画开始

我也遇到了与您相同的问题。我通过两次呼叫航路点解决了这个问题

$(".page_content").waypoint(function(direction){ // no offset on the way down
   if(direction == 'down') {
       // do this on the way down
   }
}).waypoint(function(direction){ // has offset on the way up
   if(direction == 'up') {
       // do this on the way up
   }
}, {offset: -1});

---

我知道这不是个好答案。但它对我有效。

它对向上滚动有效；但并不准确。当它到达点时，它不会触发，直到我把它移到顶部。向下方向应该使用什么？偏移量

property@francoboy7-航路点回调仅支持一个参数（方向）。您应该删除事件。
$('.page_content').waypoint(  
    function(direction) {

        if (direction ==='down') {
            $(this).fadeTo(1000, 1);
        }
        else {
                $(this).fadeTo(1000, 0);        
        }

    }, { offset: '50%' });

$(".page_content").waypoint(function(direction){ // no offset on the way down
   if(direction == 'down') {
       // do this on the way down
   }
}).waypoint(function(direction){ // has offset on the way up
   if(direction == 'up') {
       // do this on the way up
   }
}, {offset: -1});