2
$(document).ready(function(){
        // The plugin
        $.fn.image = function(src, f){
        return this.each(function(){
                var i = new Image();
                        i.src = src;
                        i.onload = f;
                        this.appendChild(i);
                });
        }

        // The code for the image to load
  $("#asdf").image("images/3a.jpg",function(){
            alert("The image is loaded now");
        });     
});

iveは上記のコードを見つけました。画像を読み込むことができる要素が欲しいのですが、画像が完全に読み込まれる前に、読み込み中のgifを表示したいと思います(これはcssを使用して行います)。動作しますが、完全に読み込まれるのを待つのではなく、画像の読み込みが表示されます。アラートがhide()show()を使用している画像を表示する必要があると思いますが、関数内からそれを参照する方法がよくわかりませんか?


iveは運が悪かったのでこれを試しました、誰かが何か問題を見ます>?gifの読み込みに同じdivを使用してから、最終的な画像を使用したい

$('#preload').replaceWith('<img src="preloader.gif" />')
          .image( "http://www.google.co.uk/intl/en_uk/images/logo.gif", function() {
             $('#preload').replaceWith( this );
             // is this called when image fully loaded?
          });
4

3 に答える 3

3

代わりにLazy Loaderプラグイン (または同様のプラグイン)を使用してみてください。独自のプレースホルダー イメージを指定できることに注意してください。

于 2009-06-07T19:01:46.130 に答える
0

画像が完全に読み込まれるまでプレースホルダーgif画像を使用し、最終的な画像を表示して、見た目どおりのプラグインを見つけました

http://flesler.blogspot.com/2008/01/jquerypreload.html

于 2009-06-07T20:50:01.187 に答える
0

次のようなことを試すことができます:

    var $loadingImg = $('<img />').attr('id','loadingImg').attr('src','preloader.gif');
    $("#preload").html($loadingImg.html()).image("http://www.google.co.uk/intl/en_uk/images/logo.gif");

それがどうなるか教えてください。

于 2009-06-07T19:21:58.243 に答える