jquery动画高度向上答案

【问题标题】：jquery animate height upwardsjquery动画高度向上
【发布时间】：2012-10-30 13:18:32
【问题描述】：

所以当用户向下滚动到页面的某个部分时，我希望 div 向上（从底部到顶部）动画。

问题是我只能让它从上到下制作动画，我想相反的会很容易，显然不是。

$(document).scroll(function() {    
    var scroll = $(window).scrollTop();

    if (scroll >= 1700) {
        $(".usersuk").animate( 
            { height:"400px" }, 
            { queue: false, duration: 1000 }
        );
    } 
    else {
        $(".usersuk").animate( 
            { height:"0px" }, 
            { queue: false, duration: 1000 }
        );
    }
});

另外，有没有比使用 var scroll 更好的方法来为用户可见的东西制作动画？

【问题讨论】：

我们也需要查看您的 HTML 和 CSS。通常要实现这一点，您需要将元素的位置设为fixed 或absolute。 jsfiddle.net 会有所帮助。
相关，可能重复：stackoverflow.com/questions/10125040/…
或多或少是@RoryMcCrossan 所说的一个例子：jsfiddle.net/EeVCs/1 或者元素高度是否应该向上动画并保持其位置：jsfiddle.net/EeVCs
是的，我使用绝对位置和底部 0% 来让它向上动画。我将如何改变动画的“风格”？

标签： jquery jquery-animate

【解决方案1】：

好的，从下到上制作动画，这很容易。您所要做的就是将父容器设置为 position: relative 并将动画容器设置为 position: absolute 和 BOTTOM: 0。它当然会留在父 DIV 的底部。您可以对动画容器内的对象使用一些“溢出：隐藏”来微调动画。

最后，如果真的想在“sight”（窗口中的元素）上触发事件，则需要考虑滚动位置、窗口高度、对象位置和对象高度。这很容易，但如果你习惯插件，你可以检查“inview plugin”。我已经用过那个插件了，而且效果很好。希望这会有所帮助

【讨论】：

注意，“absolute”容器不会推送相对父级，所以如果需要可以将绝对 div 的高度添加到相对 div 的高度