|
|
|
03/16(Sun) 02:54
 フェードイン・フェードアウト
■使用方法
- パラメータ
fade(inr,ing,inb, outr,outg,outb, step);
- inr,ing,inb------フェードイン・アウトの開始の色をR,G,Bで指定します。
- outr,outg,outb--フェードイン・アウトの終了の色をR,G,Bで指定します。
- step----------フェードイン・アウトの速さを指定します。2が速く、255が遅くなります
- サンプル
黒から白に遅いスピードでフェードする。
- fade(0,0,0, 255,255,255, 255);
赤から青に速いスピードでフェードする。
- fade(255,0,0, 0,0,255, 64);
- fade(0xff,0x00,0x00, 0x00,0x00,0xff, 64); ----16進数記述も出来ます
- 背景
<BODY>タグで背景のbgcolorやbackgroundを指定するとフェードイン後指定した背景になります。
■設置方法
■下のスクリプトをコピーし、<HEAD>と</HEAD>のなかに貼りつけます。(フェードインの場合)。
|
<![CDATA[
<script language="JavaScript">
<!--
//フェードイン・アウト by「菊池さん」<http://kikuchisan.net/>
// １６進変換ルーチン
var hex="0123456789abcdef";
function dec2hex(dec){
h=(dec >> 4);
l=(dec & 15);
return (hex.charAt(h)+hex.charAt(l));
}
//カラーコド設定
function setbgColor(r, g, b) {
var hr = dec2hex(r); var hg = dec2hex(g); var hb = dec2hex(b);
document.bgColor = "#"+hr+hg+hb;
}
//フェードイン・アウト処理
function fade(sr, sg, sb, er, eg, eb, step) {
for(var i = 0; i <= step; i++) {
setbgColor(
Math.floor(sr * ((step-i)/step) + er * (i/step)),
Math.floor(sg * ((step-i)/step) + eg * (i/step)),
Math.floor(sb * ((step-i)/step) + eb * (i/step)));
}
}
fade(0,0,0, 255,255,255, 64); //フェードイン
// -->
</script>
]]>
|
■ 本文中の「戻る」ボタン等にonClick命令を使って記述します(フェードアウトの場合)。
下のサンプルはこの「戻る」ボタンにセットした例です。
|
<![CDATA[
「<A HREF="../index.html" onClick="fade(255,255,255, 0,0,0, 16)">戻る</A>」
]]>
|
|
|
