DynamicHTML




[ test-06 ]
触ると別の文字がフェイドインして現われます。


マウスポインタが触る(onMouseOver)と別の文字がフェイドインして現われてきて1秒後にもとの文字に戻ります。


Sample

Dynamic HTML














Source


<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE="JavaScript1.2">
<!--

//--表示する文字
var msg1 ="<H1>Dynamic HTML</H1>"
var msg2 ="<H1>COMING SOON</H1>"

//--フェイドイン(from f to 0)
function fin(){
    var fio = "fedcba9876543210"//--ここを"0123456789abcdef"にすればフェイドアウトになります。
      for(fi=0; fi<fio.length; fi++){
            c = fio.charAt(fi)
            wrt(c,msg2)
      }
 //最後にもとの文字に戻す
 setTimeout("wrt(c,msg1)",1000)//--この数字を代えれば元に戻す時間が変ります(1000=1秒)。
}

//--文字の書き出し
function wrt(c,msg){
    var msgLay = document.layers["msgLay0"].document
      msgLay.open()
      msgLay.fgColor = c+c+c+c+c+c
      msgLay.write(msg)
      msgLay.close()
}


<!---->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#ffffff" TEXT="#000000">
<LAYER NAME="msgLay0" 
    TOP=150
    LEFT=150
    onMouseOver="fin()"
>
<I><H1>Dynamic HTML</H1></I>
</LAYER>
</BODY>
</HTML>





//--sourceの中のこの色は注目ポイントです。
//--この色の部分を自由に書き換えて使ってみましょう(^^)/