2

次のコードを使用して糸車を表示しています。

$("#loading")
.hide()
.ajaxStart(function(){

    $(this).show();
    setTimeout("3000");
})
.ajaxStop(function(){

    $(this).hide("slow");
})
;

と：

<div id="loading">
            <img src="loading.gif" alt="Loading" />
</div>

問題: 「setTimeout() が機能していません。どうすれば Web ページの中央に画像を表示できますか?」

4

4 に答える 4

2

setTimeout2つのパラメーターを取り、最初のパラメーターはcallback関数で、2番目はtimeoutミリ秒単位です。

setTimeout(funcname,1000);

また

setTimeout(function(){
    //do stuff
},1000);

たとえば、使用できるWebページの中央に画像を表示します。このテクニック

#loading {
    position:absolute;
    top:50%;
    left:50%;
    width:100px;
    margin-left:-50px; //negative half of width
    height:80px;
    margin-top:-40px; //negative half of height
}
于 2012-06-30T17:41:29.977 に答える
1 
#loading {
   display: none;
   position: fixed;
   top: 48%;
   left: 48%
}

JS

$('#loading').ajaxStart(function(){
   var that = $(this)
    setTimeout(function() {
       that.show();
    }, "3000");
}).ajaxStop(function(){
    $(this).hide("slow");
})
于 2012-06-30T17:40:02.077 に答える
1

タイマーを使用している理由がわかりません。次のように、ajaxリクエストの開始時にタイマーをオンにし、成功またはエラー時にオフにすることができます。

$('#loading').show();

$.post(url, request)

    .success(function(data) {
        $('#loading').hide();
        // Do what you want with data
    })

    .error(function(data) {
        $('#loading').hide();
        // Show error message
    });

読み込み中の画像をページの中央に配置するには、そのコンテナーが高さ 100% の親内にあることを確認し、ネストされている場合は、その親のいずれもposition:relative.

#loading {
    position:relative;
    width:100%;
    height:100%;
}

#loading img {
    margin-top: -12px; // Half images height;
    margin-left: -12px; // Half images width;
    position:absolute;
    top:50%;
    left:50%;
}

OR

#loading {
    width:100%;
    height:100%;
}

#loading img {
    width:24px // Images width
    height:auto; // If Image size changes don't mess with proportions
    margin:0 auto;
    margin-top:48%;
}
于 2012-06-30T17:47:34.870 に答える
0

SetTimeout 関数の使い方が間違っている

setTimeout(関数(){

// sth を行う

 }、3000);
于 2012-06-30T17:39:54.357 に答える