2

div「intro」のjavascriptがようやく読み込まれました。Web ページが最初に bg 画像をロードしてから Java スクリプトをロードするため、ロードに時間がかかりすぎます。完全に読み込まれるまで、その「イントロ」divに「読み込み中ですお待ちください」というメッセージを表示する方法はありますか? イントロが最初にロードされるようにしたいだけです。

Javascript コード:

var tl = new Array(
    "=======================",
    " Welcome user, ",
    " ###########################################"
);
var speed = 50;
var index = 0;
text_pos = 0;
var str_length = tl[0].length;
var contents, row;

function type_text() {
    contents = '';
    row = Math.max(0, index - 20);
    while (row < index)
    contents += tl[row++] + '\r\n';
    document.forms[0].elements[0].value = contents + tl[index].substring(0, text_pos) + "_";
    if (text_pos++ == str_length) {
        text_pos = 0;
        index++;
        if (index != tl.length) {
            str_length = tl[index].length;
            setTimeout("type_text()", 500);
        }
    }
    else setTimeout("type_text()", speed);
}

これはスクリプトであり、基本的には div "intro" のテキスト領域に文字ごとに入力します。問題は、ページ全体が読み込まれたときに最後に読み込まれることです。約 15 秒後にテキストの印刷が開始されます。

4

4 に答える 4

2

「domready」で聞くことができるイベントがありますが、documentそれはクロスブラウザではないようです。

例：Mozilla

   document.addEventListener("DOMContentLoaded", methodName, false)

より良いオプションは、jQueryの.ready()イベントを使用することです。これらは、すべてのクロスブラウザー実装を処理します。

例えば：

$(document).ready(function(){
   //execute code here
});

//Shorthand
$(function(){
 //...
});

詳細については、この関連する質問を参照してくださいdomready。

于 2012-08-28T19:23:40.140 に答える
0

コンテンツを div タグでラップしてから、読み込み中の画像を保持する別の div をラップすることで、これに jquery を使用できます。

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

    $('#divShowMeLater').load(function () {
        $('#loading').hide();
        $('#divShowMeLater').show();
    });
})

divShowMeLaterロードされるすべてのコンテンツを含む div であると想定します。マークアップは次のようになります。

<div id="divShowMeLater" style="margin-left:auto;margin-right:auto;text-align:center;" >
    <div id="loading">Page loading...
        <img src="images/ajax-loader.gif" alt="loading page..." />
    </div>
</div>
于 2012-08-28T19:24:18.190 に答える
0

空のイントロ div を含むページをロードし、「loading please wait」を使用してスクリプトを実行し、ajax リクエストをトリガーしてページの残りをロードし、ajax リクエストから onComplete イベントでページを更新します。

于 2012-08-28T19:24:49.787 に答える
0

jQuery の使用

   $(document).ready(function() {
      // update div here 
    });

http://api.jquery.com/ready/

または、あなたはそれを行うことができます

window.onload= (function() {
  // update div here        
};
于 2012-08-28T19:25:19.097 に答える