Jquery选择器在页面加载时不工作，但在滚动后工作

我有一个jquery脚本，它检测元素的顶部位置，并在屏幕上可见时添加动画。仅当我稍微滚动屏幕时，此功能才起作用。但它不会在页面加载时添加动画

因此，我尝试记录磁贴选择器。当页面加载时，它不是选择类为fadeInTile的元素，而是在滚动屏幕一点后，我才能看到所有具有该类名的元素

$(document).ready(function(){
    function scrollCb() {
        var tiles = $(".fadeInTile").not(".animated")
        var $window = $(window);

        var docViewTop = $window.scrollTop();
        var docViewBottom = docViewTop + $window.height();
        console.log(tiles)

        tiles.each(function (i) {
            var $this = $(this);
            var elemTop = $this.offset().top;

            if ((elemTop <= (docViewBottom - 70))) {
                $this.addClass("animated").addClass("fadeInUp");
            }
        });
    }
    $(window).scroll(scrollCb)
    scrollCb()
})

编辑

---

我制作了一把小提琴，效果很好。但它在我的页面中不起作用。我的网站是基于angularjs构建的，这与此有关吗？

使用

$j=jQuery.noConflict（）

并使用

$j

选择器，而不是

$

只需让您的函数处于就绪状态即可。这可能有用

function scrollCb() {
        var tiles = $(".fadeInTile").not(".animated")
        var $window = $(window);

        var docViewTop = $window.scrollTop();
        var docViewBottom = docViewTop + $window.height();
        console.log(tiles)

        tiles.each(function (i) {
            var $this = $(this);
            var elemTop = $this.offset().top;

            if ((elemTop <= (docViewBottom - 70))) {
                $this.addClass("animated").addClass("fadeInUp");
            }
        });
    }
$(document).ready(function(){

    $(window).scroll(scrollCb)
    scrollCb()
})

函数scrollCb（）{
var tiles=$（“.fadeInTile”）。不（“.animated”）
变量$window=$（window）；
var docViewTop=$window.scrollTop（）；
var docViewBottom=docViewTop+$window.height（）；
console.log（平铺）
瓷砖。每个（功能（i）{
var$this=$（this）；
var elemTop=$this.offset（）.top；
if（（elemTop）你能把这个添加到一个JSFIDLE吗？如果我自己创建的话效果很好：你能不能发布你的htmlit不工作。它给我一个错误“$j不是一个函数”。我应该把所有的“$”都改成“$j”还是仅仅是选择器？你必须使用$j而不是$allover函数，上面的函数你必须编写无冲突代码
function scrollCb() {
        var tiles = $(".fadeInTile").not(".animated")
        var $window = $(window);

        var docViewTop = $window.scrollTop();
        var docViewBottom = docViewTop + $window.height();
        console.log(tiles)

        tiles.each(function (i) {
            var $this = $(this);
            var elemTop = $this.offset().top;

            if ((elemTop <= (docViewBottom - 70))) {
                $this.addClass("animated").addClass("fadeInUp");
            }
        });
    }
$(document).ready(function(){

    $(window).scroll(scrollCb)
    scrollCb()
})