📄 ch14-210.html
字号:
<HTML>
<HEAD>
<TITLE>页面背景篇--逐渐减弱效果</TITLE>
</HEAD>
<BODY bgcolor="#fef4d2" onload=FadeBGColor()>
<br><br>
<center>
<h2>页面背景篇--逐渐减弱效果</h2>
<hr width=300>
<br><br>
<!-- 案例代码1开始 -->
<script language=JavaScript>
var index = 0;
var loop = 1;
var factor = new Array(1,1,1);
var firstfactor = new Array(1,1,1);
var secondfactor = new Array(1,1,1);
var startcolor = new Array(100,255,200);
var middlecolor = new Array(100,50,0);
var endcolor = new Array(100,255,200);
var color = new Array(startcolor[0],startcolor[1],startcolor[2]);
var nextcolor = new Array(middlecolor[0],middlecolor[1],middlecolor[2]);
var hex = new Array;
var letters = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');
function FadeBGColor() {
for (i=0 ; i <=2 ; i++) {
if (middlecolor[i] == startcolor[i]) { firstfactor[i] = 0; }
if (middlecolor[i] > startcolor[i]) { firstfactor[i] = -1; }
if (endcolor[i] == middlecolor[i]) { secondfactor[i] = 0; }
if (endcolor[i] > middlecolor[i]) { secondfactor[i] = -1; }
factor[i] = firstfactor[i]; }
FadeColoring = setTimeout('FadeColor()',1);
}
function FadeColor() {
for (i=0 ; i<=2 ; i++) {
firstletter = Math.floor(eval(color[i] / 16));
secondletter = eval(color[i] -(firstletter * 16));
hex[i] = letters[firstletter]+letters[secondletter];
color[i] = color[i] - (factor[i] * 10);
if (((color[i]*factor[i])-(nextcolor[i]*factor[i])) <= 0) {factor[i] = 0;color[i] = nextcolor[i];}}
document.bgColor = '#'+hex[0]+hex[1]+hex[2];
if (((Math.abs(factor[0]) + Math.abs(factor[1]) + Math.abs(factor[2])) == 0)&&((color[1] != endcolor[1])||(color[2] != endcolor[2])||(color[0] != endcolor[0]))){
for (i=0 ; i<=2 ; i++) { nextcolor[i]=endcolor[i]; factor[i]=secondfactor[i]; } }
if ( (Math.abs(factor[0]) + Math.abs(factor[1]) + Math.abs(factor[2])) != 0 ){
<!-- [Step1]: 这里可以设置颜色减弱的速度 -->
FadeColoring = setTimeout('FadeColor()',10); }
else {
if (loop == 1){
for (i=0 ; i<=2 ; i++) {
factor[i]=firstfactor[i];
color[i]=startcolor[i];
nextcolor[i]=middlecolor[i]; }
FadeColoring = setTimeout('FadeColor()',10); } }
}
function StopFadeBGColor(){
index = 1;
clearTimeout(FadeColoring)
}
function ReFadeBGColort(){
if (index == 1){ FadeColoring = setTimeout('FadeColor()',1); }
}
</script>
<!-- 案例代码1结束 -->
<!-- 案例代码2开始 -->
<!-- [Step2]: 在此能够更改页面显示的链接按钮名称 -->
<a href="javascript:ReFadeBGColort();">开始</a>
<a href="javascript:StopFadeBGColor();">停止</a>
<!-- 案例代码2结束 -->
</BODY>
</HTML>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -