Question

我知道如何使用css为元素设置动画。但是我正在尝试设置jQuery，以便当用户向下滚动时，css动画效果被激活。所以基本上添加到了元素类中。我知道如何根据设定的高度来做，但我的动态内容会在大小和高度上发生变化。如何改变高度尺寸？

我希望css在元素在浏览器中可见时激活。下面的代码根据设置的高度执行此操作，但我的内容是动态的。

设定高度的代码：

$(window).scroll(function() {
        $('#animatedElement').each(function(){
        var imagePos = $(this).offset().top;

        var topOfWindow = $(window).scrollTop();
            if (imagePos < topOfWindow+400) {
                $(this).addClass("slideUp");
            }
        });
    });

更新

请注意上面的代码不是我的，而是http://www.justinaguilar.com/animations/index.html#how的作者。我可能没有在问题中表明自己，以便更好地解释它......

在基本术语中，我只是想在浏览器中显示一个类（例如'slide'）到div。我不能根据高度这样做，因为div可能在不同的地方。

Answer 1

这是一个有效的例子。只需参考slideUp类更改CSS样式，例如为动态，非固定高度添加overflow:hidden。

jQuery: animate element on scroll

动态高度可见时动画元素

1 个答案: