Home > Archives > 2010年5月 Archive
2010年5月 Archive
jQueryロールオーバー + マウスON画像プリロード
- 2010年5月18日 04:17
既にあるとは思うし動作検証も対してしてないけど、
ちょっと探してみつからないのでサクッと書いてみました。
imgタグのファイル名で拡張子の前に"_off"とついているものは、自動的にホーバーすると"_off"を"_on"にリプレイスしたパスの画像に切り替わる関数を付与するのと、その"_on"ファイルをプリロードします。
ベースとなっているのは以下のリンク先様のコード
jQueryで画像をロールオーバーする方法2
上記のソースコードに関数を付与するついでに、onSrcを配列のimageオブジェクトに読み込むように下だけです。
$(document).ready(function() {
var preload = new Array();
var count = 0;
$("img").each(function(){
if($(this).attr("src").match("_off.")){
var offSrc = $(this).attr("src");
var onSrc = offSrc.replace("_off.","_on.");
$(this).hover(
function() { $(this).attr("src",onSrc); }
,function() { $(this).attr("src",offSrc); }
);
preload[count] = new Image();
preload[count].src = onSrc;
count++;
}
});
});
たぶんちゃんと動いてるはず・・・。多分。
処理的にメモリくいすぎたりとかそういうの検証してないのであしからず・・・。
- Comments (Close): 0
- TrackBack (Close): 0