網頁漸變色

 

<script language="JavaScript">
function prefix(s) {
// Make sure the hex# is 2 characters
if (1==s.length)
s="0"+s
return s
}

function breakApart(start) {
// Split the hex # into the RGB components
var temp = new Array()
temp[0] = parseInt(start.substring(0,2),16)
temp[1] = parseInt(start.substring(2,4),16)
temp[2] = parseInt(start.substring(4,6),16)
return temp
}

function diffParts(startInt, endInt, steps) {
// Determine the increment amount for each step
var temp = new Array()
for (var i=0; i<3; i++)
temp[i] = Math.round((endInt[i] - startInt[i]) / steps)
return temp
}

function createHR(start, end, steps, width, height) {
var startInt = breakApart(start)
var endInt = breakApart(end)
var stepList = diffParts(startInt, endInt, steps)
str = "<TABLE width="+width + " height="+height
var alignment = arguments[7] // Optional alignment argument
if (null!=alignment) {
alignment.toLowerCase()
// Ignore values other than left, right, and center
if ("left"==alignment)
str+=" align=left"
else if ("right"==alignment)
str+=" align=right"
else if ("center"==alignment)
str+=" align=center"
}
str+=" cellspacing=0 cellpadding=0 border=0><TR>"
for (var r=0; r < steps; r++) {
var hr = prefix(startInt[0].toString(16))
var hg = prefix(startInt[1].toString(16))
var hb = prefix(startInt[2].toString(16))
// increment color
for (var i=0; i < 3; i++)
startInt[i]+=stepList[i]

str+="<TD BGCOLOR="+hr + hg + hb+">"
// Cross-browser version
// Make sure to point the image to a valid
// location on your server
if (arguments[5]==true) str+="<IMG SRC='../../gifs/s.gif' WIDTH=1 HEIGHT=1>"
str+="</TD>"
// Vertical rule
if ((arguments[6]==true) && (r < steps-1))
str+="<TR>"

}
str+="</TABLE>"
return str
}
t1=createHR("00FF00","FF00FF",32,"50%",3, true)
t2=createHR("CCFF00","FF00CC",16,32,16, true)
t3=createHR("FF0000","FFFFFF",32,5,150, true, true, "left")
t4=createHR("FFFFFF","0000FF",32,5,150, true, true, "right")
t5=createHR("FFAA00","AA00EE",32,100,8, true, false, "center")
t6=createHR("00FFFF","FF00FF",32,32,32, true, true)
document.write(t1)
document.write(t2)
document.write(t3)
document.write(t4)
document.write(t5)
document.write(t6)
</script>