无法让jQuery Waypoints与JavaScript创建的内容一起玩好

所以，我一直在为我目前正在处理的项目寻找jQuery Waypoint。我用它过去，并没有任何问题，但对于这个特定的项目，我似乎无法得到它的工作。这次的不同之处在于所有的竞争对手都是用JavaScript注入的，尽管这不应该成为一个问题，因为您使用$.waypoints('refresh');来简单地更新航点位置。无法让jQuery Waypoints与JavaScript创建的内容一起玩好

由于内容是即时创建的，因此我引入了一个计时器以确保在脚本初始化之前加载内容。

$(document).ready(function(){ 

    setTimeout(function(){ 

     waypoints(); 
     $.waypoints('refresh'); 

    }, 2000); 

}); 

function waypoints() { 

    alert('jQuery Waypoint has initialized'); 
    //ep.listener.waypoints() 

    $(function() { 
     var $things = $('article.curr section'); 

     $things.waypoint(function(direction) { 
      if (direction === 'down') { 
      //do stuff 
      console.log(this); 
      console.log('down'); 
      } 
     }, { offset: '50%' }); 

     $things.waypoint(function(direction) { 
      if (direction === 'up') { 
      //do stuff 
      console.log(this); 
      console.log('up');    
      } 
     }, { 
      offset: function() { 
      return $.waypoints('viewportHeight')/2 - $(this).outerHeight(); 
      } 
     }); 

    }); 

}

会发生什么事情是，只有一次，只有一次发射航点。它会识别最上面的部分，除非您滚动到底部并刷新页面，否则它将识别所有四个元素。

我在这里做错了什么？

现场演示高达HERE
用户名：开发
密码：lolboy

来源

2013-08-21 INT

最初，该演示在Chrome中并没有很好地发挥作用。现在应该纠正。 – INT

你已经做了你的身体标签位置：固定和溢出：隐藏，这意味着滚动事件永远不会触发窗口上，相反，滚动事件在＃对待垃圾。 Waypoint监听窗口上的滚动事件。

你应该改变你的CSS，让窗口滚动而不是文章，或将航点的上下文更改为正确的元素，即＃treats-for-trash（请参阅：http://imakewebthings.com/jquery-waypoints/#doc-options）。

来源

2013-08-26 00:43:34 RoryKoehein

谢谢！以为我从头到脚都经历过这些文档，但你证明我错了:) – INT

无法让jQuery Waypoints与JavaScript创建的内容一起玩好

回答

相关问题