ページの読み込みが完了したらTouch me !のメッセージがでて、触ると画像がフェイドインします。変数の設定によって黒地からのフェイドインもできます。
Sample
Source
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript1.2">
<!--
//--画像のファイル名を指定してください
fiImg_Name="BOTAN.GIF"
//--画像のサイズを指定してください
fiImg_Width=100 //幅
fiImg_Height=70 //高さ
//--画像の表示位置をページ左上からのピクセル数で指定してください
fiImg_X=180 //左(LEFT)から
fiImg_Y=150 //上(TOP)から
//--フェイドインタイプを指定してください
var fiType="WTOB"//--"WTOB"なら白地に画像が、"BTOW"は黒地に画像が現われます
if(fiType=="WTOB"){bgcl0="#ffffff";txtcl0="#000000"}//--bgcl0=は背景色,txtcl0=は文字色を指定しています
if(fiType=="BTOW"){bgcl0="#000000";txtcl0="#ffffff"}
//--フェイドイン用レイヤー構築
with(document){
write('<LAYER NAME="fiLayer0"')
//write(' BACKGROUND="BARON0.GIF"')
write(' LEFT='+fiImg_X+'')
write(' TOP='+fiImg_Y+'')
write(' CLIP='+fiImg_Width+','+fiImg_Height+'')
write(' VISIBILITY="hide"')
write('>')
write('<IMG SRC='+fiImg_Name+'')
write(' WIDTH="'+fiImg_Width+'"')
write(' HEIGHT="+fiImg_Height+">')
write('</LAYER>')
for(fiLay=0;fiLay<=5;fiLay++){
var bkgd=""+fiType+fiLay+".GIF"
write('<LAYER NAME="noi'+fiLay+'"')
write(' BACKGROUND='+bkgd)
write(' LEFT='+fiImg_X+'')
write(' TOP='+fiImg_Y+'')
write(' CLIP='+fiImg_Width+','+fiImg_Height+'')
if(fiLay==5){
write(' onMouseOver="if(ldFlg)sho()"')
write('>')
write('<I>Now loading.......</I>')//--これを書かなければメッセージは出ません
}else{
write('>')
}
write('</LAYER>')
}
}
//--Touch me !を表示
function ld(){
var fiMsg=document.layers["noi5"].document
fiMsg.write('<I>Touch me !</I>')//--これを書かなければメッセージは出ません
fiMsg.close()
ldFlg=true
}
//--フェイドイン
var fi=0
var fiID=setTimeout("",1)
var fiSpd=10 //フェイドインスピード(数値が小さいほど早い)
function sho(){
document.layers["noi5"].visibility="hide"
document.layers["fiLayer0"].visibility="show"
if(fi<=5){
document.layers["noi"+fi].visibility="hide"
fi++
clearTimeout(fiID)
fiID=setTimeout("sho()",fiSpd)
}else{
clearTimeout(fiID)
}
}
<!---->
</SCRIPT>
<BODY BGCOLOR="&{bgcl0};"
TEXT="&{txtcl0};"
onLoad="ld()"
>
</BODY>
</HTML>