如何在網頁中加載所有其他內容後最終顯示圖像

如何在加載網頁中的所有其他內容後最後顯示圖像。當按下按鈕時，我從數據庫中檢索到一個頁面上的圖像。我想先載入整個頁面，最後載入內容後載入圖像。有幫助嗎？如何在網頁中加載所有其他內容後最終顯示圖像

2011-05-20 harsh

如果負載你的意思是下載頁面的各個部分，並構建DOM，則：

 
$(document).ready(function() { 
    $('#theimage').show(); 
});

來源

2011-05-20 15:44:56

可以加載並使用此功能將其添加到您的HTML它在javascript：

$(window).load(function() { 
    // in 2 steps for clarity, can be optimized 
    img_html = '<img src="/path/to/image" alt="bla bla" />'; // step 1, generate image html 
    $("#image_div").append(image_html);      // step 2, append image to some div 

    // optional, see my comment below 
    $("#image_div img").load(function() { 
    // triggers when newly added image is completely loaded 
    }); 
});

這使得所有事情都完成加載圖像開始的一定負荷。

請注意，示例中的圖像在加載時顯示，如果您想先加載並顯示它，則必須隱藏它並使用圖像的.load事件來顯示它。

來源

2011-05-20 15:44:20 jeroen

嘿jeroen ..感謝您的快速回復.. 你能更具體..如果你不介意..！我是新手...我沒有得到你.. – harsh 2011-05-20 15:50:13

@harsh我添加了一些示例代碼。 – jeroen 2011-05-20 16:54:44

$(document).ready(function() { 
    $('#imageid').attr("src", "/new/path/to/image.jpg"); 
});

來源

2011-05-20 15:45:53 stevecomrie

這裏是我在我的php代碼中使用的圖像src屬性。你能告訴我如何在你的javascript代碼中編寫這個src屬性的虛擬路徑嗎？ – harsh 2011-05-20 16:18:09

@harsh：javascript代碼看起來幾乎與您提供的php代碼完全相同： '$（'＃imageid'）。attr（「src」，「user/hangout_images/<？php echo $ imag_addr;？>」） ;' – stevecomrie 2011-05-23 01:03:44

在你的頁面初始加載你可以只寫一個佔位符（DIV，跨度，甚至沒有分配給它的圖像）。

然後附加到按鈕點擊事件，你可以使用JQuery + Ajax回調（不是回發，或有任何理由回發其他比獲取圖像？）到您的服務器（或web服務）獲取圖像路徑並將其分配給佔位符。你可以使用各種jQuery動畫來增加它，以「淡入」你的圖像或向下滑動......你喜歡什麼。

來源

2011-05-20 15:47:16

你可以使用javascript來動態設置圖像的URL後dom加載？

如果你有HTML結構

<image id="image_id"/>

然後使用下面的jQuery代碼：

$(document).ready(function() { 
    $("#image_id").attr("src", "link_to_image"); 
});

否則，你可以使用一些CSS技巧，首先隱藏圖像，所以不會從服務器下載。

然後使用下面的jQuery代碼來顯示圖像，一旦DOM準備就緒：

$(document).ready(function() { 
    $("#image_id").show(); 
});

與此同時，着眼於圖像預載。這可能對你有用http://www.techrepublic.com/article/preloading-and-the-javascript-image-object/5214317

來源

2011-05-20 15:47:29 Shanison

如何在網頁中加載所有其他內容後最終顯示圖像

回答

相關問題