0

「loading.gif」を開始するJquery画像プリローダーと、ページを開いた直後に画像プリロード領域を開始しようとしています（それが適切な用語でさえある場合）。JavaScriptの配置などを実験してきましたが、常に読み込まれます私の好みには少し遅すぎます。

URLはこちら

http://eleven23.net/beta/work/web/lounge22-preload.php

ロードを高速化するために実験中の変数がいくつかあります

どちらを使用する必要がありますか?

$(window).bind("ロード", function() {

  • また -

$(document).ready (function() {

</body>また、jquery の開始時間を短縮することを期待する直前に、インライン JavaScript を配置しました。

助言がありますか？

4

3 に答える 3

2

昔ながらの image 要素を使用して画像をキャッシュしました。それらが読み込まれると、ブラウザのキャッシュにあることがわかります。それらが周囲にあることを確認したい場合は、範囲外に出られない配列でそれらを保持します。

var images = [];

// Preload a list of images with an optional callback as a final parameter.
function preload() {
    if ( arguments.length == 0 ) return;
    var waiting = arguments.length - 1,
        count = 0,
        callback = arguments[ arguments.length - 1 ];
    if ( typeof callback == "string" ) {
        callback = function() { };
        waiting++;
    }
    function loaded() {
        if ( ++count == waiting ) callback();
    }
    for ( var i = 0 ; i < waiting ; i++ ) {
        var image = new Image();
        image.onload = loaded;
        image.src = arguments[ i ];
    }
}

preload( "people.gif", "images/star.jpg", "/site/images/panorama.jpg", function() {
    doSomethingWithImages();
});

image 要素を使用することの主な欠点について知りたいです。

MDC で Image の元のドキュメントを見つけることができませんが、Image オブジェクトの使用に関する最新のドキュメントを次に示します。

https://developer.mozilla.org/en/Canvas_tutorial/Using_images

しかし、このオブジェクトは Canvas と HTML 5 よりも前のものです。

https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html

于 2009-07-22T01:14:39.150 に答える
0

$（document）.ready（）は、DOMがロードされ、操作の準備ができると起動します。ここに読み込み中の画像を追加し、大きな画像を事前に読み込んでから、読み込み中の画像を再度削除しても、期待どおりに機能しません。

読み込み中の画像をマークアップに追加して（すぐにレンダリングされるように）、大きな画像を事前に読み込み、読み込み時に読み込み中の画像を非表示/削除する必要があります。

ここに、簡単なプラグインを使用して画像をプリロードするための優れたチュートリアルがあり ます。

于 2009-07-21T23:52:59.253 に答える
0

ねえ、完全なコールバック、プリロードする画像の自動読み取り、およびアニメーションの多くのイージングを備えた、私が書いた素晴らしい jQuery Preloader を確認できます。ここで確認してください: jQuery Preloader

于 2010-08-17T08:06:04.923 に答える