可変変化

【コマとコマの時間を変えた画像変化】




いい加減ネタが尽きてきた変化シリーズです。
タグは以下の通りです。
<script type="text/javascript" language="JavaScript">
<!--
var n=0;
ani =new Array()
ani[0] = new Image(); ani[0].src =
"/_images/blog/_563/warainosisya/pkao.jpg";
ani[1] = new Image(); ani[1].src =
"/_images/blog/_563/warainosisya/p1.jpg";
ani[2] = new Image(); ani[2].src =
"/_images/blog/_563/warainosisya/p5.jpg";
ani[3] = new Image(); ani[3].src =
"/_images/blog/_563/warainosisya/p10.jpg";
ani[4] = new Image(); ani[4].src =
"/_images/blog/_563/warainosisya/p50.jpg";
ani[5] = new Image(); ani[5].src =
"/_images/blog/_563/warainosisya/p100.jpg";
ani[6] = new Image(); ani[6].src =
"/_images/blog/_563/warainosisya/p500.jpg";
// -->
</script>
<img src="/_images/blog/_563/warainosisya/pkao.jpg"
width="45";height="37" name="para" alt="pkao.jpg"
onload="n++;if(n>6) n=0;
if(n==0){setTimeout('document.para.src = ani[0].src;',6400);
}else
if(n==1){setTimeout('document.para.src = ani[1].src;',100);
}else
if(n==2){setTimeout('document.para.src = ani[2].src;',200);
}else
if(n==3){setTimeout('document.para.src = ani[3].src;',400);
}else
if(n==4){setTimeout('document.para.src = ani[4].src;',800);
}else
if(n==5){setTimeout('document.para.src = ani[5].src;',1600);
}else
if(n==6){setTimeout('document.para.src = ani[6].src;',3200);
}">
です。

ani[0] = new Image(); ani[0].src =
"最初に表示するファイル";
ani[何コマ目か] = new Image(); ani[何コマ目か].src =
"何コマ目かのファイル";
としてあらかじめ読み込んでおきます。
setTimeoutで時間つぶしてから表示します。400とか800（単位ミリ秒）が待ち時間です。
番号0が最初に表示するファイル（顔）であり，
100ミリ秒待って番号1のファイル（1）
200ミリ秒待って番号2のファイル（5）
400ミリ秒待って番号3のファイル（10）
800ミリ秒待って番号4のファイル（50）
1600ミリ秒待って番号5のファイル（100）
3200ミリ秒待って番号6のファイル（500）
6400ミリ秒待って番号0のファイル（顔）
を表示するという繰り返しになっています。
ちょいと難しいですかね・・・
利用する人いないと思いますが，使う場合は
URL自動リンクはリンクしないにして，タグのキーワードは外してくださいね。

タグ：可変変化

コメント 23

深夜のこんばんは（^^ 2.6
コメント、ありがとうございまするm(_ _)m
click（c）互助会の会長（自称）、巡回でござる（笑）
今日もあれ（コーコク）、ポチッとな！
いつもランクリ応援、クリック協力、感謝でござるm(_ _)m
by へっぽこデイトレーダー (2009-02-06 02:34) 

こんなことも出来るんですね＾＾；
☆
by bigbang (2009-02-06 04:08) 

コンピューター学校の講師もされているとか？
HTMLシリーズの記事、いつも楽しく見させてもらっています。

私なんて、HTMLソースをそのまま表示させたい時にどうしたらよいのか分からず、最近やっと知りましたからｗ
by ホタルの館 (2009-02-06 04:16) 

せめて、「これ」でくらいは(-_-)は見たくないなぁｗ
by nano (2009-02-06 05:45) 

ふむふむ"φ(･ｪ･o)~
☆
by にゃんたま (2009-02-06 07:18) 

面白いです♪
成る程～待たせるんですねｗ
☆
by デルフィー (2009-02-06 08:03) 

リッチではできないことだけは
わかりました。(^^ゞ　え？違う？☆ｱﾚ？
by デルフィニウム (2009-02-06 08:03) 

うーーん、私に応用できるかやってみたいと思います＾＾

ご訪問ありがとうございます
広告応援クリックさせて頂きます
by やまがたん (2009-02-06 08:26) 

まったく無理です＾＾；☆・・・
by sasapand (2009-02-06 09:33) 

いろんな事ができるんですね～。
こういう事ができる自分であれば
パソコンいじりも楽しいでしょうね。☆
by がり (2009-02-06 10:00) 

この技は知りませんでした。
何かの機会があったら使ってみよう・・・
by ティファロックハート (2009-02-06 10:59) 

こういうのは、どこで覚えたんでしょうかね。
さっぱりです。。。
by Butch (2009-02-06 13:20) 

だいたい分かるけど、GIFとか使った方が簡単なような。
でも、容量増えるか?
☆
by goro2001 (2009-02-06 13:24) 

おー、時間差攻撃ですね。
by こぱんだつま (2009-02-06 16:15) 

難しそうですが、すごいです！！
☆
by miyu* (2009-02-06 17:27) 

もちもん、わかりません＠＠
おもしろいのはわかります＾＾☆
by caco (2009-02-06 18:19) 

マジマジ見ちゃいます～☆
by ぴんくま (2009-02-06 18:42) 

応援のみ巡回で失礼します
☆
by rin (2009-02-06 18:57) 

いやーっ。難しそうですね（・ω・｀）
でも作れたら格好いいなぁ・・・・。
by 雪猫 (2009-02-06 20:32) 

やってみたいけど、難しいからやめとこ。
by R-Month (2009-02-06 22:20) 

お久しぶりです、ご無沙汰しておりましたm(__)m
お久しぶりなのですが、相変わらずnice！が押せないのでした＾＾；
☆
by yuya (2009-02-06 23:11) 

む、難しいィィ～、さっぱり解りませんが、スゴイッ！
ソネットへ講師として潜入して現場？の声を届けて下さい！（笑

by 薔薇少女 (2009-02-07 00:08) 

またじっくり取り組みたいです。(勿論、丸写しですが。)
いつになることやら…(^^;)
by felix__U^ェ^Uわん (2009-02-24 17:31)