waypoint插件Jquery

时间:2013-04-09 02:12:17

标签: javascript jquery jquery-plugins jquery-events

$(function() {

    // Do our DOM lookups beforehand
    var nav_container = $(".nav-container");
    var nav = $("nav");

    nav_container.waypoint({
        handler: function(event, direction) {
            nav.toggleClass('sticky', direction=='down');

            if (direction == 'down') nav_container.css({ 'height':nav.outerHeight() });
            else nav_container.css({ 'height':'auto' });
        },
        offset: 15
    });

});
你好吗? - 我正在使用imakewebthings.com/jquery-waypoints向下移动nav元素。我怎么想在我的页面的特定部分取消导航元素,然后向后滚动它以将其粘回并将其带到原始位置 - 在向下滚动后可能是30pixcel。

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

如果我理解你想要一个元素在超过某个阈值时坚持下去,当它超过那个元素时返回固定元素?

如果是这样的话 - 请查看http://drewdahlman.github.io/Pinned/这将完全符合您的要求。它是一个易于使用的插件。

$("#element").pinned({
    bounds: 30, // when to become sticky
    scrolling: 0, // position during scroll 
});

它会在30以上后返回到原来的位置,并在达到30px时坚持下去。确保将其默认位置设置为绝对位置。

祝你好运!