Question

我正在使用jQuery Waypoints在滚动页面各部分时突出显示导航项。所有这一切都很好;感谢您复制http://imakewebthings.github.com/jquery-waypoints/演示中的代码。

我的演示是：http://www.pandlmedia.com/index.php/index_new

但是，我还想在#footer div处创建一个航点，它会触发一个事件来改变所有导航链接的颜色。

$('#footer').bind('waypoint.reached', function(event, direction) {
    $('.nav ul a').addClass('white');
});

这不起作用，因为一旦它退出#footer div，就没有什么可以改变回来的。我在编写jQuery或使用这个插件时没有很多经验。我需要添加什么才能使其工作？事实上有两个级别的航路点也会导致问题吗？

Answer 1

好吧，仔细观察“粘性元素”演示，我能够修改消失的“.top”按钮的示例，使其能够满足上述需求：

<script type="text/javascript">
$(document).ready(function() {
    $('.container .nav ul a').addClass('black');
    $.waypoints.settings.scrollThrottle = 30;
    $('#footer').waypoint(function(event, direction) {
        $('.container .nav ul a').toggleClass('black', direction === "up");
    }, {
        offset: '50%'
    });
});

关键是在我的css中的.white类下面添加.black类，以便它正确覆盖color参数。

jQuery Waypoints有不同的动作

1 个答案: