javascript文字特效

1、简单的文字变色

-------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>简单文字变色</title>
</head>

<body>

<h1>
简单的文字变色实例
</h1>
</body>

</html>

------------------------------

2、文字变色

------------------------------

<html>

<head>

<title></title>
<script language="javascript">
    var colors = new Array("red","blue","brown","yellow","pink","purple","cc3300","cc00aa","66ffcc");
    var a = 0;
    var b = 1;
    function changeColor() {
        color = colors[a];
        var str = "<font size = '8' face = '黑体' color = ' " + color + " '><p>javascript中实现文字的颜色变换</p></font>";
        document.all.div1.innerHTML = str;

        //实现颜色循环
        a += b;
        if(a > colors.length || a < 0) {//当a小于颜色数组中的第一个元素的索引或大于最后一个元素的索引时，改变b的符号。
            b = -b;
        }

        var xx = setTimeout("changeColor()",300);
    }
</script>
</head>

</html>
---------------------------------

3、变换的文字

----------------------------------------------------

<html>
<head>
<title>变换的文字</title>
</head>

<body >
<div id="cc" align="center" style="position: absolute; left: -1; top: 5; width: 1003px; height: 19"></div>
<script language="javascript">
    var words = new Array();
    var colors = new Array("red","blue","brown","pink","purple");
    words[0] = "aaaaaaaaaaaaaaa";
    words[1] = "bbbbbbbbbbbbbbb";
    words[2] = "ccccccccccccccc";
    words[3] = "ddddddddddddddd";
    words[4] = "eeeeeeeeeeeeeee";

    var i = 0;
   document.all.cc.style.width=document.body.clientWidth;//将层的宽度设为页面工作区的宽度

    //自定义函数changeWords(),用于改变层的文字用字体颜色
    function changeWords() {
        if(i == words.length) {
            i = 0;
        }        //这里开始又多写一个等号！！致使程序怎么都不对！
            //动态替换文字及颜色
      // cc.innerHTML = '<font color = "' + colors[i++] +'", size = "5">' +words[i++]+'</font>';
      //注意！不能像上面这样写！！这样的话每次输出文字时i是自加了两次！！
        cc.innerHTML = '<font color = "' + colors[i] +'", size = "10'">' +words[i]+'</font>';
        i++;
        //
        setTimeout("changeWords()",500);
    }
    changeWords();

</script>
</body>

</html>
-----------------------------------------------

4、追逐点亮的文字（霓虹灯效果）

<html>

<head>

<title>追逐点亮的文字</title>

</script>
</head>

</html>
--------------------------

5、萤光文字

-------------------

<html>

<head>

</head>

<body>
<script language="javascript">
    var str = "明日科技图书";
    var divLay = '<div id = "div1" align = "center" style = "width:400px; filter:glow(#cc0022,strength=2); font-size:40px; font-family:Courier New;">'+str+"</div>";
    document.write(divLay);

    function change() {
        if(div1.filters.glow.strength == 2) {
            div1.filters.glow.color = "#29e9e6";//设置层中字体的外边框的颜色
            div1.filters.glow.strength = 4;//设置层中字体的外边框的长度
        }
        else {
            div1.filters.glow.color = "#cc0033";
            div1.filters.glow.strength = 2;
        }
    }
    setInterval("change()",200);
</script>
</body>

</html>

javascript文字特效相关推荐

JavaScript实例-文字特效1-文字滚动
文字滚动效果: 文字滚动代码: <html> <meta http-equiv="Content-Type" content="text/html; ...
JavaScript网页特效-浮现社会主义核心价值观文字动画效果
1.案例呈现用户在页面单击鼠标左键,页面浮现"富强"."民主"."文明"."和谐"."自由".&q ...
实用JavaScript网页特效编程百宝箱pdf
下载地址:网盘下载内容介绍编辑计算机的出现是人类历史上的伟大创举,因为它正在彻底改变着人们生活中的方方面面,网络化的计算机更是日益渗透到社会发展的各个应用领域,从20世纪五六十年代网络雏形发展到 ...
jQuery插件Label Effect制作个性化的文字特效
制作个性化的网页文字,实用性貌视不强,毕竟花里胡哨,同时应该场景也不多,了解一下相关的实现原理: 使用说明需要使用jQuery 库文件和Label Effect 库文件[在线实例 ] 一,包含文件部 ...
JavaScript文本特效实例小结【3个示例】
本文实例讲述了JavaScript文本特效.分享给大家供大家参考,具体如下: 1.标题跑马灯常常能够在一些新闻网站,或者其他地方,看到文字在一个特定的区域内,来回滚动.一旦超出边界就消失了,那么这些 ...
超强的苹果官网滚动文字特效实现
每年的苹果新产品发布,其官网都会配套更新相应的单页滚动产品介绍页.其中的动画特效都非常有意思,今年 iPhone 14 Pro 的介绍页不例外. 最近,刚好有朋友问到,其对官网的一段文字特效特别感兴趣 ...
超酷的javascript文字云/标签云效果 - D3 Cloud
日期:2012-10-11 来源:GBin1.com 在线演示如果你想创建漂亮的文字云或者标签云效果的话,你可以考虑使用D3-Cloud,这是一个超棒的开源字体云效果javascript类库,基于 ...
jQuery 3D文字特效
jQuery 3D文字特效 jQuery 3D文字特效 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" &q ...
《JavaScript网页特效经典300例》
<JavaScript网页特效经典300例> 基本信息作者: 杨磊张志美丛书名: 百炼成钢系列丛书出版社:电子工业出版社 ISBN:9787121220524 上架时间:20 ...
html霓虹灯文字效果,jQuery绚丽霓虹灯文字特效插件
novacancy.js是一款非常有意思的.效果绚丽的jQuery绚丽霓虹灯文字特效插件.该文字特效插件可以将任意文本转换为霓虹灯效果,你可以设置灯光的颜色,发光的颜色,几个文字是不亮灯状态,以及灯光 ...

javascript文字特效

javascript文字特效相关推荐

最新文章

热门文章