[代码收集]彩虹文字文本渐变色 - 笑忘书网页代码收藏馆

首页-代码 2013-10-11 06:47:34 -0400

★彩虹文字——文本渐变色★

请勿抄袭本页面

代码说明

一段文本，颜色均匀过渡，如同天空中雨后的彩虹，横过屏幕，十分赏心悦目，这种文本颜色均匀过渡的效果，你可能在photoshop等图形编辑软件里用到过，但现在，你也可以用到网页上了!比起简单的文字，是不是更具煽情性。转自网页特效代码

html代码

function MakeArray(n){
   this.length=n;
   for(var i=1; i<=n; i++) this[i]=i-1;
   return this
}

hex=new MakeArray(16);
hex[11]="A"; hex[12]="B"; hex[13]="C"; hex[14]="D"; hex[15]="E"; hex[16]="F";

function ToHex(x){              // Changes a int to hex (in the range 0 to 255)
   var high=x/16;
   var s=high+"";               //1
   s=s.substring(0,2);          //2 the combination of these are the same as the trunc function
   high=parseInt(s,10);         //3
   var left=hex[high+1];        // left part of the hex-value
   var low=x-high*16;           // calculate the rest of the values
   s=low+"";                    //1
   s=s.substring(0,2);          //2 the combination of these are the same as the trunc function
   low=parseInt(s,10);          //3
   var right=hex[low+1];        // right part of the hex-value
   var string=left+""+right;    // add the high and low together
   return string;
}

function rainbow(text){
   text=text.substring(3,text.length-4);        // gets rid of the HTML-comment-tags
   color_d1=255;                                // any value in 'begin' 0 to 255
   mul=color_d1/text.length;
   for(i=0;i<text.length;i++){
      color_d1=255*Math.sin(i/(text.length/3)); // some other things you can try>> "=255-mul*i" to fade out, "=mul*i" to fade in, or try "255*Math.sin(i/(text.length/3))"
      color_h1=ToHex(color_d1);
      color_d2=mul*i;
      color_h2=ToHex(color_d2);
      document.write("<FONT COLOR='#FE"+color_h1+color_h2+"'>"+text.substring(i,i+1)+'</FONT>');
   }
}

// --End Hiding Here -->
</script>
<script language="JavaScript">红雨瓢泼泛起了回忆怎么潜，你美目如当年流转我心间，渡口边最后一面洒下了句点，与你若只如初见何须感伤离别<!__");} 
// --></script>

代码演示

[代码仅供参考，转载请注明出处]

----Comments(5)----
欢乐の毛~ (@pai) | @ at 2015-01-03 07:26:
的确不行。。

笑忘书 (@35230) | @ at 2014-02-14 03:28:
试了下好像不行

迷茫者的微笑 (@1044529113) | @ at 2014-02-13 21:23:
如何给那段文字分行啊？

纸飞机的夏天 (@lianglee) | @ at 2014-01-01 01:22:
很不错！

I'M 合合 (@hlj) | @ at 2013-10-21 05:50:
不错

Subscribe | Register | Login | N