关注技术领域
27 Jan
利用JavaScript控制网页背景色,复制以下代码编辑Html查看。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>JavaScript控制网页背景色</title>
</head>
<body onLoad='setInterval ("BgFade()",20)'>
<SCRIPT LANGUAGE="JavaScript">
var i=0, bg=0, bgI=1, cNum=1;
var cArray = new Array(4);
var hex = new Array(30);
cArray[0]="FF0000";
cArray[1]="FFFFFF";
cArray[2]="0000FF";
cArray[3]="FF0000";
cArray[4]="FFFFFF";
hex[0]="00";
hex[1]="09";
hex[2]="11";
hex[3]="1A";
hex[4]="22";
hex[5]="2B";
hex[6]="33";
hex[7]="3C";
hex[8]="44";
hex[9]="4D";
hex[10]="55";
hex[11]="5E";
hex[12]="66";
hex[13]="6F";
hex[14]="77";
hex[15]="80";
hex[16]="88";
hex[17]="91";
hex[18]="99";
hex[19]="A2";
hex[20]="AA";
hex[21]="B3";
hex[22]="BB";
hex[23]="C4";
hex[24]="CC";
hex[25]="D5";
hex[26]="DD";
hex[27]="E6";
hex[28]="EE";
hex[29]="F7";
hex[30]="FF";
function BgFade() {
if (cNum==1) {FadeRed();}
else if (cNum==2) {FadeWhite();}
else {FadeBlue();}
}
function FadeRed() {
bg+=bgI;
if (bg>29) {bgI*=-1;}
else if (bg<1) {bgI*=-1;cNum=2;}
document.body.bgColor="#"+hex[bg]+"0000";
}
function FadeWhite() {
bg+=bgI;
if (bg>29) {bgI*=-1;}
else if (bg<1) {bgI*=-1;cNum=3;}
document.body.bgColor="#"+hex[bg]+hex[bg]+hex[bg];
}
function FadeBlue() {
bg+=bgI;
if (bg>29) {bgI*=-1;}
else if (bg<1) {bgI*=-1;cNum=1;}
document.body.bgColor="#0000"+hex[bg];
}
</script>
</body>
</html>
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。