opacity = 0後加載html

我有這段代碼。不透明度0和不透明度1有效！但負載（頁）不加載。爲什麼？opacity = 0後加載html

function cargarContenido(pagina) { 
    $('#content').animate({"opacity":"0"}); 
    if ($('#content').css('opacity') == 0) { 
     $("#content").load(pagina); 
    } 
    $('#content').animate({ "opacity": "1" }); 
}

，如果我把只有如此，它工作正常

function cargarContenido(pagina) { 
    $("#content").load(pagina); 
}

來源

2013-01-18 Vektor Unbreakable

'的console.log（$（ '＃內容'）的CSS。（'opacity'））'你確定它返回0嗎？（和以前的動畫是異步的） – fcalderan

您需要使用的animate和load方法回調參數按順序執行代碼。試試這個：

function cargarContenido(pagina) { 
    $('#content').animate(
     { "opacity": "0" }, 
     function() { 
      $("#loadimage").show(); // show a loading image 
      // load content when opacity = 0 animation finished 
      $("#content").load(
       pagina, 
       function() { 
        $("#loadimage").hide(); // hide a loading image 
        // make opacity = 1 when content has been loaded 
        $('#content').animate({ "opacity": "1" }); 
       } 
      ) 
     } 
    ); 
}

注意我已經擴展了這段代碼的格式，以清楚發生了什麼。如果需要，您可以移除很多間距以縮短間距。

來源

2013-01-18 10:16:39

你是最棒的！非常感謝！！！只有一個問題...它的posibble插入load.gif而html加載？ –

確實，我會爲你更新我的答案。不要忘記將其中的一個答案標記爲已接受。 –

animate()是異步的，所以當你檢查不透明度時，它不是零，因爲動畫函數還沒有完成。您可以使用回調動畫做同樣的事情，不透明度已完成動畫後：

function cargarContenido(pagina) { 
    $('#content').animate({"opacity":"0"}, function() { 
     $(this).load(pagina, function() { 
      $(this).animate({ "opacity": "1" }); 
     }); 
    }); 
}

來源

2013-01-18 10:16:45 adeneo

-1

嘗試使用動畫的附加參數：

$('#content').animate({"opacity":"0"}, slow, function() { 
    $("#content").load(pagina); 
    $('#content').animate({ "opacity": "1" }); 
});

來源

2013-01-18 10:16:55 ATOzTOA

最後回答... – ATOzTOA

我想完之後，你應該做的東西回調函數中的動畫，因爲它會在完成動畫之後運行。 Read the documentation有關complete功能，

$('#content').animate({"opacity":"0"},500,function(){ 
        $("#content").load(pagina,function(){ 
         $('#content').animate({ "opacity": "1" }); 
        });    
    });

來源

2013-01-18 10:17:41

我猜你想要做的是加載任何「pagina」是後＃內容的不透明度爲0？您應該使用完整的參數而不是問如果不透明度爲0：

功能cargarContenido（pagina）{

$('#content').animate({"opacity":"0"}, 1000, function(){ 

    $("#content").load(pagina, function(){ 

      $('#content').animate({ "opacity": "1" }); 

    }); 

});

}

來源

2013-01-18 10:19:36 Foxhoundn

opacity = 0後加載html

回答

相關問題