jQuery顯示jquery生成的css加載完成時的項目

Question

有沒有辦法隱藏對象，直到我的腳本完成加載？使用ajaxcomplete（）或ajaxSuccess（）不起作用。在示例腳本下面。

有一個圖像的id：imagefocus，每當我通過ajax更改圖像時，您會看到原始圖像大小的一秒。

$("#imageFocus").bind("load", function(){ 
    var width = $(this).width(); 
    var height = $(this).height(); 

    if(height > 443) { 
     var scaleRatio = height/443, 
      width  = Math.round(width/scaleRatio), 
      mLeft  = Math.round((590 - width)/2); 
     $(this).css({ 
      height:  "443px", 
      width:  width+"px" 
     }); 
     $(this).parent().css({ 
       marginTop: "0px", 
       marginLeft: mLeft+"px" 
     }); 
    } 
} 

Answer 1

隱藏通過CSS的圖像，然後顯示它在它的load事件。另外，在你讓Ajax調用隱藏圖像之前，下面的代碼會在圖像加載完成後顯示它。

的CSS

#imageFocus{ 
    display:none; 
} 

JS

$("#imageFocus").bind("load", function(){ 
    var $this = $(this); 
    var width = $this.width(); 
    var height = $this.height(); 

    if(height > 443) { 
     var scaleRatio = height/443, 
      width  = Math.round(width/scaleRatio), 
      mLeft  = Math.round((590 - width)/2); 

     $this 
     .css({ 
      height:  "443px", 
      width:  width+"px" 
     }) 
     .show() //<---------Show the image 
     .parent() 
     .css({ 
       marginTop: "0px", 
       marginLeft: mLeft+"px" 
     }); 
    } 
} 

Answer 2

是，先從：

$("#imageFocus").hide() 

和結束（在你的負載功能）

$("#imageFocus").show() 

Answer 3

這是因爲負載裝飾和自動插入你的形象。你不能在actualcallback中實現你想要的行爲。相反，創建一個隱藏圖像的功能，然後加載新圖像。然後在回調中，使其再次可見