ページの読み込み中にWebサイトのコンテンツを同期する方法

Question

ページが読み込まれるときに最初にコンテンツが読み込まれ、その後イメージがフラッシュされ、次に別のコンテンツが読み込まれるようなWebサイトを同期します。私はhttp://gmailblog.blogspot.com/で同じことを見ていると同じように

[画像を読み込む方法を確認]

は達成する方法はありますか？どのリンクやソースコードも理解できます。

Answer 1

私はウェブサイトを見ました。これは、ビンと同じことです。これを行う方法 ？

コアHTMLコードでは、<img src="loading.gif" id="1"/>または任意の要素を指定します。コアHTMLが（例えばため。img要素の「SRC」属性）の値を属性

を変更するためにはJavaScriptを使用して、 </body>タグの前に、行われ

。 bodyタグを閉じる前にHTMLの最後に書き込まれる必要があることを思い出してください。ブラウザは、順番に応じて

の内容をロードします。これは、HTMLコンポーネントの優先度ベースのロードを実現するために使用できます。

Answer 2

JSを使用してページ上のすべての要素の読み込みを同期させることができます。例：コンテンツが次のようになった後に画像をロードする方法：

a）src属性ではなく、別の属性、たとえば 'isrc'にイメージの場所を指定します。あなたのonloadコールバック内

b）は（）あなたはjQueryのを使用している前提としています

var loadCounter = 0; 
$('img').each(function() { 
    if($(this).attr('isrc')) { 
    this.onload = function() { 
     loadCounter++; 
     if($('img[isrc]').length == loadCounter) { 
     // .. proceed to loading other stuff like flash etc.. 
     } 
    } 
    $(this).attr('src', $(this).attr('isrc')); // load the image 
    } 
});