すべての画像を読み込んだ後にイベントを発生させたい。また、次div#ID
のような特定の sに各イメージ タグを追加したいと考えています。
image01.jpg -> <div id="load01"></div>
image02.jpg -> <div id="load02"></div>
image03.jpg -> <div id="load03"></div>
...
中途半端で困ってます…
HTML
<div id="blinker0">Smooth Blink</div>
<div class="profile" id="blinker1"></div>
<div class="profile" id="blinker2"></div>
<div class="profile" id="blinker3"></div>
<div class="profile" id="blinker4"></div>
<div class="profile" id="blinker5"></div>
JS:
function smBlink(){
for(i=0;i<3;i++) {
$("#blinker0,#blinker1, #blinker2, #blinker3, #blinker4, #blinker5")
.fadeTo('normal', 0.3)
.fadeTo('normal', 1.0);
}
}
$('<img />')
.attr('src', 'http://placekitten.com/160/160')
.load(function(){
$('#blinker1').append( $(this) );
smBlink();
});
ライブサンプル: http://jsfiddle.net/nori2tae/E4erT/
このサイトを参考にしました: http://jquery-howto.blogspot.jp/2009/02/preload-images-with-jquery.html