文字のフェード

 
 
今度は文字のフェードイン・アウトです。
これも似たような仕掛けになっています。というか概念は同じです。
あとは、「何をフェードさせるか」という考え方です。つまりこうします。
 
 
color="FEDCBA9876543210";
for(i=0;i<16;i++)
{
  c=color.charAt( i );
  b=c+c+c+c+c+c;
}
document.layers[x].document.write( '<FONT SIZE=3 COLOR='+c+'>'+msg+'</FONT>' );
document.layers[x].document.close();
 
 
青文字の部分が付け加えたものです。まずは「x」と「msg」という変数の名は何でも構いません。
ただ、これはNN vol.3以上でないとできません。ですから、
 
if(navigator.appName=="Netscape" && navigator.appVersion.charAt(0)>=3)
 
というif文でくくってやるといいでしょう。こうするとIEでエラーが出なくなります。
 
今度は、for文の以前で「j=1」という、別の変数を宣言してやりましょう(そして上記のスクリプトの最後でインクリメントさせることを忘れないで下さい)。そして例えばこうします。
 
 
if(j==1) { msg="This is test.";  x=01; }
if(j==2) { msg="Fade in!";  x=02; }
if(j==3) { msg="Fade out?";  x=03; }
 
 
このの部分も、何でも構いません。
また、これだけではフェードが完成しません。これらのスクリプトを例えば「FadeTest()」という関数にひとまとめし、HTMLで呼んでやる必要があります。
 
 
<BODY onLoad=setTimeout('FadeTest()',0);>  ←「0」は待ち時間(ミリ秒単位)
<SPAN id="01" style="position:absolute; top:50; width=200;"></SPAN>
<SPAN id="02" style="position:absolute; top:75; width=200;"></SPAN>
<SPAN id="03" style="position:absolute; top:100; width=200;"></SPAN>
 
 
ここで「top」は上からの、「width」は左からのピクセル単位の距離です。
 
 
 
 
 
Programming's top