动画div以在视图中捕捉最多元素
我有一系列元素，一个在下一个元素之下。 每个元素的顶部都有内容，但底部有一个空格，水平条位于底部。
页面上只有一个水平栏。 它需要“固定”到第一个元素的底部，直到该元素滚动到视图之外，此时需要将其设置为当前视图元素的底部的动画。
我嘲笑了一个小提琴，它显示了突出当前活动部分的一些逻辑，我很满意。 这些部分默认为灰色。 向上和向下滚动时，最具视图的部分变为红色，表示它是活动部分 – 工作正常。 水平条为蓝色。
我正在努力的是让蓝色条动画到红色部分的底部，因为它在滚动时会发生变化。
http://jsfiddle.net/9kW5N/2/
我的代码在小提琴中不起作用的主要原因我认为是因为窗口滚动事件不是“活动”所以不知道当前活动（红色）部分是什么。
谁能建议如何实现这一目标？
感谢任何人们！
所以我在changeSection()函数中更改了一些代码。 它有点工作，但绝对不完美。 也许它会指出你在正确的方向？
还注释了动画onScroll。
function changeSection() { $('.active').removeClass('active'); var currentlyActive = $('section').eq(closestArrPos); currentlyActive.addClass('active'); $("#horiz").animate({"top" : currentlyActive[0].offsetTop + currentlyActive.height()}, "fast"); }
演示 ： http ： //jsfiddle.net/9kW5N/5/
还需要将window.scroll事件放在setTimeOut函数中，这样只有在滚动完成后才会有效地调用它，而不是在整个滚动过程中多次调用。