js Clip whimsical colorful gradient word effect_javascript skills

Previously, the Clip attribute was used to splice the upper and lower halves of the text with different colors.
Colorful gradient fonts, compatible with all major browsers.
The only really useful function in page JS is the colorful() function:

Copy code The code is as follows:

function colorful(obj,font,r,g,b,type){
var boxObj;
if(typeof(obj)=="string"||typeof(obj)=="number" ){
boxObj = document.getElementById(obj);
}else{
boxObj = obj;
}
boxObj.innerHTML="" font "";
var num = boxObj.getElementsByTagName("a")[0].scrollWidth;
boxObj.innerHTML="";
for(var i=0;i< ;=num;i ){
var j=i 1;
var c=Math.round(255/num*i);
switch(Number(type)){
case 0: r=c;g=c;b=c;break;
case 1:r=c;break;
case 2:g=c;break;
case 3:b=c;break;
}
var iObj = document.createElement("A");
iObj.innerHTML=font;
iObj.style.clip="rect(auto " j "px auto " i "px )";
iObj.style.color="rgb(" r "," g "," b ")";
iObj.href="#";
boxObj.appendChild(iObj);
}
}

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>CLIP implements color gradient font</title> <style type="text/css"> body{font:12px/1.5 arial} h3{padding:10px;margin:0;background-color:#c00;border:1px dashed #fff;color:#fff;font:16px/1.5 arial;} .box{position:relative;background-color:#fff;width:auto;margin:0 auto;padding:0 30px;font:700 20px/1.5 "榛</style>