在Ajax加载的内容上无法识别的航点

我正在将页面加载到div中。我还试图建立一个航点，以便当用户向下滚动页面时，菜单会改变颜色。在Ajax加载的内容上无法识别的航点

我遇到的问题是一旦ajax内容被加载，div的新高度就不会被浏览器识别。

这是我有：

$(".cta").live('click', function() { 
    $('#faq').load('about-us/faqs/index.html'), 
    function() { 
     $("#faq").waypoint(function (event, direction) { 
      if (direction === 'up') { 
       $("#siteNav li a").removeClass("siteNavSelected"); 
       $("#siteNav li.nav3 a").addClass("siteNavSelected"); 
      } 
     }, { 
      offset: function() { 
       return $.waypoints('viewportHeight') - $("#faq").outerHeight(); 
      } 

     }); 
    } 
    return false; 
});

任何想法？谢谢。

来源

2011-08-01 Yahreen

我并不熟悉waypoint插件的内在特性，但您也可以绑定滚动事件，然后捕获.scrollTop()值。看起来是这样的：

$(document).bind('scroll', function(event) {   
    var scrollTop = $(window).scrollTop(); 
    if (scrollTop < 1000 && $('siteNav li').hasClass('styleA')) { return; } 
    else { 
     $('siteNav li').removeClass('styleB'); 
     $('siteNav li').addClass('styleA'); 
    } 
    if (scrollTop > 1000 && $('siteNav li').hasClass('styleB')) { return; } 
    else { 
     $('siteNav li').removeClass('styleA'); 
     $('siteNav li').addClass('styleB'); 
    } 
});

你必须玩一点值才能让它在正确的位置行事。此外，您必须在测试中使用大于或小于该值的值，就好像用户位于页面顶部并使用鼠标上的滚轮按下页面一样，您不会获得中间的任何值。

来源

2012-10-24 19:26:45 Peter

使用$.waypoints('refresh');，从文档：

这将迫使基于其偏移选项各航点的触发点的重新计算。无论何时调整窗口大小或添加新的航点，都会自动调用此功能。 如果您的项目正在更改DOM或页面布局而未执行其中一项操作，则可能需要手动调用它。

来源

2013-07-04 16:58:36

我发现添加'$ .waypoints（'refresh'）;'解决了我的问题，在AJAX内容注入到页面后没有触发路点事件。感谢Svilen。 – Dan

在Ajax加载的内容上无法识别的航点

回答

相关问题