背景の色を徐々に変える
Webページをちょっとかっこよくするための軽くて、お手軽な小技を研究するページです。
このページはリンクフリーです。どのページにでもリンクを張ってもらって結構です。
JavaScriptを使って、背景の色を徐々に変えるページを作ってみましょう。(ちょっと、ちらつきますが...)
次のサンプルを <HEAD> と </HEAD> の間に入れます。
----サンプル 開始----
<HEAD>
...
<SCRIPT Language="JavaScript">
<!--
var rclr = 0;
var gclr = 0;
var bclr = 0;
var rmax = 0xc0;
var gmax = 0xff;
var bmax = 0xc0;
var count = 0
var max = 50;
function getHex(dec)
{
var s = "0123456789abcdef";
var hex;
hex = s.charAt(dec >> 4);
hex = hex + s.charAt(dec % 16);
return (hex);
}
function chgColor()
{
document.bgColor = "#" + getHex(parseInt(rclr)) + getHex(parseInt(gclr)) + getHex(parseInt(bclr));
if (count < max) {
count ++;
rclr += rmax / max;
gclr += gmax / max;
bclr += bmax / max;
timer = setTimeout("chgColor()",10);
}
}
// -->
</SCRIPT>
...
</HEAD>
----サンプル 終了----
次のサンプルを </HEAD>後のどこかに入れます。
----サンプル 開始----
<BODY onLoad="chgColor()">
----サンプル 終了----
var rmax = 0xc0; この値を変えると最終的なR(赤)の色を変えられます。
var gmax = 0xff; この値を変えると最終的なG(緑)の色を変えられます。
var bmax = 0xc0; この値を変えると最終的なB(青)の色を変えられます。
var max = 50; この値を変えると最終的な色への変化の時間を変えられます。
HOMEへ
夫婦で楽しむRPGお勧め度チェック あ〜んど 座談会
もう1つのなりてんのページへ
なりてんへのメールその1
なりてんへのメールその2