Jquery中文网 www.jquerycn.cn
Jquery中文网 >  脚本编程  >  javascript  >  正文 自动改变文字大小和颜色的js代码分享

自动改变文字大小和颜色的js代码分享

发布时间:2015-01-06   编辑:www.jquerycn.cn
本文分享一个js代码,用于实现自动修改文字大小与字体颜色,是学习js编程的不错的小例子,供大家参考。

本节分享的这段js代码,是javascript自动改变文字大小和颜色的效果的例子。

代码如下:

<body  bgcolor="#000000">  
<div id="text"  style="font-size:20px;">改变文字大小和颜色</div>  
<script type="text/javascript">  
var size = 20;  
var falg = 1;  
function colortext()  
{  
    //获取文字的大小  
    document.getElementById("text").style.color = getcolor();  
    document.getElementById("text").style.fontSize = getSize();  
    }  
//设置文字颜色      
function getcolor()  
{  
    var mycolor = "#";  
    var color ="123456789abcdef";  
    var colorcode = color.split("");  
    for(var i=0;i<6;i++)  
    {  
        mycolor+=colorcode[Math.floor(15*Math.random())];         
    }  
    return mycolor;  
}  
//返回字体大小  
function getSize()  
{  
    if(falg == 1)  
    {  
        size = size+1;  
        if(size == 60)  
            falg = 0;  
        return size;  
    }  
    if(falg == 0)  
    {  
        size = size-1;  
        if(size == 20)  
            falg = 1;  
        return size;  
    }  
}  
setInterval("colortext()",200);  
</script>  
</body>

有兴趣的朋友,保存以上代码为.html格式文件,双击执行看下效果如何?
一个有趣的改变文字大小与字体颜色的功能,就跃然纸上了,呵呵!

您可能感兴趣的文章:
自动改变文字大小和颜色的js代码分享
js 隔行变色与鼠标悬停自动变色的实现代码
Linux shell中echo改变输出显示样式的方法
Javascript 将 rgb 颜色值转换为 16 进制值的代码
6款新颖的jQuery和CSS3进度条插件推荐
jQuery 打造动态渐变按钮 详细图文教程
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
jquery 实现的改变颜色与背景的代码 change(fontsize,background)补充2
JQuery最佳实践之精妙的自定义事件
javascript实现隔行变色函数代码一例

[关闭]