_.js ライブラリー
imgRndLoop.js
//画像をランダムな回数だけループする
Last UpDate 10.29.1996
書式:
<SCRIPT LANGUAGE="JavaScript">
imgPath='画像ファイルのURL ( 画像番号と拡張子を除く。たとえば、buta0.gifなら"0"と".gif"を除く)'
kazu=画像ファイルの枚数
imgType='画像ファイルの拡張子'
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="imgRndLoop.js"></SCRIPT>
animation1(IMGタグindex番号)
imgPathは、たとえば、http://www.fureai.or.jp/~tato/画像0.gifなら
imgPath='http://www.fureai.or.jp/~tato/画像' までです。
画像ファイルは画像名0.gif,画像名1.gif,画像名2.gif,....のように0から始まるナンバリングをして保存しておく。
IMGタグindex番号IMGタグ画像に割り振られた番号。1枚目の画像から0,1,2,...という風に自動的についてます。この番号を指定することで、アニメーションさせる画像を特定します。
ソース:<![CDATA[
rnd=0
imgNo=0
loops=0
//イメージの事前読み込みだよん
if(navigator.appVersion.charAt(0)>=3)
{
takuimg = new Array();
for(i=0;i<kazu;i++)
{
takuimg[i] = new Image();
takuimg[i].src = imgPath +i+"."+imgType;
};
};
//ランダムだ
function rndInt1()
{
if(navigator.appVersion.charAt(0)>=3)rnd=Math.random();
rnd=parseInt((""+rnd).charAt(2));
return rnd;
};
//アニメーション本体
function animation1(IMGtgNo)
{
rndInt1();
loops=33+rnd+rnd;
//出目も多少調整できるです^^;;
if(rnd==0){imgNo=0};
if(rnd==1){imgNo=1};
if(rnd==2){imgNo=2};
if(rnd==3){imgNo=3};
if(rnd==4){imgNo=0};
if(rnd==5){imgNo=1};
if(rnd==6){imgNo=2};
if(rnd==7){imgNo=3};
if(rnd==8){imgNo=2};
if(rnd==9){imgNo=3};
for(k=0;loops>k;k++)
{
if(navigator.appVersion.charAt(0)>=3)
{
if(imgNo>=kazu){imgNo=0}
document.images[IMGtgNo].src = takuimg[imgNo].src;
imgNo++;
};
};
};
]]>
**このスクリプトにはNN2.x(IE3.0含む)へのエラー回避文、if(navigator.appVersion.charAt(0)>=3){}が入っていますが、これはHTML内に直接コピーして使うことを想定して念のために入れたものです。.js内で使う時は不要ですから削っていただいてかまいません。
Example:
右の4枚の絵をloopしています。
この画像を取り替えればアイディア次第でいろいろな事ができます(^^)。
Example'sソース:
(このソースをコピーしてあなたのページに貼るだけでもNN3.X〜なら動きます^^)
<![CDATA[
<SCRIPT LANGUAGE="JavaScript">
imgPath='http://www.fureai.or.jp/~tato/JS/IMG/buta';
kazu=4;
imgType='gif'
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="http://www.fureai.or.jp/~tato/JS/LB/imgRndLoop.js"></SCRIPT>
<FORM><INPUT TYPE="button" VALUE=' 押してみ^^ ' onClick="animation1(0)"><p>
ちなみに<BR>
<INPUT TYPE="radio" NAME='' onClick="animation1(1)"> IMGタグindex番号1を回します<BR>
<INPUT TYPE="radio" NAME='' onClick="animation1(2)"> IMGタグindex番号2を回します<BR>
<INPUT TYPE="radio" NAME='' onClick="animation1(3)"> IMGタグindex番号3を回します<BR>
<INPUT TYPE="radio" NAME='' onClick="animation1(4)"> IMGタグindex番号4を回します<BR>
</FORM>
]]>
_.js ライブラリー
JvaScriptExamples
Maintained by
tato@fureai.or.jp works1996takahashi factory