3

我正在使用 jquery 的 $.ajax 将图像页面加载到 div 中的站点上工作。当用户滚动到页面底部时,另一页图像被加载到 div 中。目前我有新的内容淡入,但它在图像完全加载之前淡入。我检查了解决方案,但找不到任何对我有用的解决方案。为了澄清,每组图像都是一个 div,其中填充了单个图像的 div。

这是我正在使用的加载功能:

function loadContent(pageName, pageView, max_feed){
        loader="<div id=loader><img src=SPACER" height=\"100\" \>"
            + "<br/><img src=\"LOADER" />"
            + "<br/><img src=\"SPACER" height=\"100\" \></div>";
        $(loader).appendTo('#photo_container').fadeIn('fast');
        $.ajax({
            url:pageName,
            data:{view:pageView, max_feed_id:max_feed},
            success:function(result){
                $('#loader').remove();                  
                $(result)
                    .appendTo('#photo_container')
                    .hide()
                    .fadeIn('slow');
                $(window).data('loading', false);
            }
        });
    };

有没有什么简单的方法可以在调用 fadeIn() 之前等待新内容加载?即有没有类似的东西

$(window).load(...)

我可以只用于 div 内容吗?我正在考虑设置某种全局变量,例如 isLoadingMore 然后在 ajax 加载内容的开头将其设置为 false,然后添加

$(window).load(...)

函数到 ajax 页面,其中有一个函数将变量设置为 true,然后在调用 loadContent 函数中的 fadeIn 函数之前添加一个 while 循环或等待该标志设置为 true 的东西。不知道这是否是一个好主意,甚至工作

4

2 回答 2

4

在您的图像上,您可以执行以下操作

$('img').load(function(e){
$(this).fadeIn();
});
于 2012-08-16T15:27:36.850 回答
0

听起来我的插件是一个不错的候选者:waitForImages

于 2012-08-28T04:55:17.890 回答