渐变文字的实现方法_文本链接特效

渐变文字的实现方法，这里是用JavaScript实现的文本渐变效果，或许对你会有所帮助。为了演示方便，程序使用了JS去循环输出了文字。

<HTML>
<HEAD>
<TITLE>渐变字</TITLE>
</HEAD>
<body>
<script>
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){              
    var high=x/16;   
    var s=high+"";               
    s=s.substring(0,2);          
    high=parseInt(s,10);         
    var left=hex[high+1];        
    var low=x-high*16;           
    s=low+"";
    s=s.substring(0,2);          
    low=parseInt(s,10); 
    var right=hex[low+1];        
    var string=left+""+right;    
    return string;
}

function fadein(text){   
    text=text.substring(3,text.length-4);  
    color_d1=255;                                
    color_d1b=255;
    color_d1c=255;
    mul=color_d1/text.length;   
    for(i=0;i<text.length;i++){      
        color_d1=mul*i; 
        color_d1b=255-mul*i;
        color_d1c=255*Math.sin(i/(text.length/3));
        color_h1=ToHex(color_d1);      
        color_d2=mul*i;      
        color_h2=ToHex(color_d2);      
        color_h1b=ToHex(color_d1b);      
        color_d2b=mul*i;      
        color_h2b=ToHex(color_d2b);      
        color_h1c=ToHex(color_d1c);      
        color_d2c=mul*i;      
        color_h2c=ToHex(color_d2c);    
        document.write("<FONT COLOR='#FF"+color_h1+color_h2+"'>"+text.substring(i,i+1)+'</FONT>');   
  }
    document.write('<p>');
    for(i=0;i<text.length;i++){      
        color_d1=mul*i; 
        color_d1b=255-mul*i;
        color_d1c=255*Math.sin(i/(text.length/3));
        color_h1=ToHex(color_d1);      
        color_d2=mul*i;      
        color_h2=ToHex(color_d2);      
        color_h1b=ToHex(color_d1b);      
        color_d2b=mul*i;      
        color_h2b=ToHex(color_d2b);      
        color_h1c=ToHex(color_d1c);      
        color_d2c=mul*i;      
        color_h2c=ToHex(color_d2c);      
        document.write("<FONT COLOR='#FF"+color_h1c+color_h2c+"'>"+text.substring(i,i+1)+'</FONT>');   
    }
    document.write('<p>');
    for(i=0;i<text.length;i++){      
color_d1=mul*i; 
color_d1b=255-mul*i;
color_d1c=255*Math.sin(i/(text.length/3));

color_h1=ToHex(color_d1);      
        color_d2=mul*i;      
        color_h2=ToHex(color_d2);      
        color_h1b=ToHex(color_d1b);      
        color_d2b=mul*i;      
        color_h2b=ToHex(color_d2b);      
        color_h1c=ToHex(color_d1c);      
        color_d2c=mul*i;      
        color_h2c=ToHex(color_d2c);      
        document.write("<FONT COLOR='#FF"+color_h1b+color_h2b+"'>"+text.substring(i,i+1)+'</FONT>');   
    }
}
// --End Hiding Here -->
</script>
<SCRIPT LANGUAGE="JavaScript">
示例文字：模板无忧渐变文本演示.<!__");
}
</SCRIPT>
</body>
</html>

所属频道：文本链接特效/更新时间：2012-12-12

[收藏][报错][返回列表]

渐变文字的实现方法_文本链接特效

文本链接特效Rss订阅特效代码搜索

文本链接特效推荐

猜你也喜欢看这些