jquery - img表示processing.gifのsrcを変更した後、実際のimgがロードされるまで

Question

重複の可能性：
JavaScriptを介して画像を読み込んでいるときにスピナーを表示する方法

私はimg、次のbtn、前のbtnを持っています

次のボタンは次の画像を次のようにロードします

crntSrc=$("img").attr('src');
nextSrc=(crntSrc+1);
$("img").attr('src',nextSrc);

しかし、nextSrcが完全にロードされるまでprocess.gif画像を表示したいと思います。

Answer 1

css で画像の背景として process.gif を設定することができます。

​img{
 background:url('process.gif') no-repeat center;   
}

</p>

Answer 2

次のようなことができます。

function preload(src, cb)
{
    var img = new Image();
    img.load = cb;
    img.src = src;
}

var newImage = "/foo/foo.jpg";

// Function is called after image is loaded into memory.
preload(newImage, function(){
    $("#afterloadimg").attr("src", this.src);
});