jQuery 画像を事前読み込みさせておく方法 – 画像のプリロードの実装方法

この記事は4年前に書かれました。不適当な記述を含む場合がありますので、参考程度に留めてください。

どうもこんばんは。Toshikuraです。今回のTipsは【jQuery 画像を事前読み込みさせておく方法 – 画像のプリロードの実装方法】です。画像の事前読み込みはロードの合計時間を算出したり、マウスホバーでの画像のちらつきを防いだりと色々な場面で活用できるTipsですので覚えておいてもいいかもしれませんね。ちなみにCSSのみでも実装可能です。その場合同一要素内に複数の背景画像を設置したり、imgとして読ませてわざわざどこかに飛ばしたりといういくつかの方法があります。

jQuery 画像を事前読み込みさせておく方法

事前にjQueryを読ませる事をお忘れなく。


jQuery.preloadImages = function(){
for(var i = 0; i<arguments.length; i++){
jQuery("<img>").attr("src", arguments[i]);
}
};
$.preloadImages(
"1.gif",
"2.gif",

"9.gif",
"10.gif"
);

以上になります。

参照:to-R