Question

我使用load（）将某些内容加载到名为“contents”的div中，并在开始加载之前隐藏它。我希望div在内容完全加载后才会淡出，但看起来div'内容'即使在加载完成之前也会淡入。我使用以下脚本：

$("#menu").click(function(){
        $("#contents").hide().load(loadUrl, function(){
            $(this).fadeIn(1000);});
    });

有人可以帮助我解决这个问题吗？我目前正在我的本地服务器上测试它。

Answer 1

使用如下，

$("#contents").hide().load(loadUrl, function(){ }).fadeIn(1000);

Answer 2

它看起来像浏览器重绘问题，在调用fadeIn之前给出超时应解决问题

$("#menu").click(function(){
    $("#contents").hide().load(loadUrl, function(){
        var el = $(this);
        setTimeout(function(){
            el.fadeIn(1000);
        }, 100)
    });
});

您也可以尝试使用delay功能

$("#menu").click(function(){
    $("#contents").hide().load(loadUrl, function(){
        $(this).delay(10).fadeIn(1000);
    });
});

Jquery在内容完成加载之前执行

2 个答案: