如何使滚动超过某个点后出现浮动菜单？ [复制]

我想让四个菜单选项卡在您滚动经过页面上的某个点（例如：1000px）后出现。我希望它们出现时从左向右滑入。这就是我想要的，但位于浏览器的左侧。任何意见都会受到赞赏。

首先，您需要从跟踪页面的滚动开始。其次，您需要在需要时为从左到右的分隔线设置动画。为此，您需要使用scroll函数，以及其他一些用于动画部分的函数。

这是您想要的基础，没有卷轴。

function slider() {
    if (document.body.scrollTop > 100) //Show the slider after scrolling down 100px
        $('#slider').stop().animate({"margin-left": '0'});
    else
        $('#slider').stop().animate({"margin-left": '-200'}); //200 matches the width of the slider
}

现在，您需要在用户滚动时触发此函数，使用：

$(window).scroll(function () {
    slider();
});

最后，您还需要在用户首次到达时调用该函数，以防用户从页面的中间位置开始，使用：

$(document).ready(function () {
    slider();
});

有几件事要note:

我已将滑块宽度硬编码为 200 像素，起点硬编码为 100 像素。 这stop()函数非常重要，它可以防止 animate 函数被冗余调用。

这是一个工作jsfiddle http://jsfiddle.net/GrahamWalters/PgtGC/1/与匹配的 CSS