zoukankan      html  css  js  c++  java
  • 用JavaScript实现可复用性的文字闪烁的效果

    以下为JSP页面:

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="zh-CN" xml:lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml"><!-- 需要使用符合 XML 规范的 XHTML 文档 ,在大多数情况下,绝大多数 XHTML 作者都不需要定义多个命名空间,但是您仍然有必要理解存在着多个命名空间,以便在需要选择将基于某个 DTD 的内容嵌入其他 DTD 定义的内容中时,可以管理多个命名空间-->
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>文字闪烁</title>
        <style type="text/css">
            .changecolor0{color:#f00;}
            .changecolor1{color:#0f0;}
            .changecolor2{color:#00f;}
            .changecolor3{color:#f0f;}
            .changecolor4{color:#0ff;}
            .changecolor5{color:#000;}
        </style>
    </head>
    <body>
        <span id="remaincolor">文字闪烁效果</span>
        <script type="text/javascript">
            var textID=document.getElementById("remaincolor");    
            textShine(textID);
            function textShine(textID){
                var i=0;
                var textId=textID;
                function shine(textId){                    
                    textID.className="changecolor"+i%6;
                    i++;
                    if(i==7){    
                        i=0;
                    }
                }
                setInterval(function(){shine(textId);},500);
            }
        </script>
    </body>
    </html>

  • 相关阅读:
    sql server 查看锁表SQL【转】
    在cxGrid表格中如何获得当前列的字段名
    获取cxgrid footer内容
    gulp学习总结
    前端入门应该掌握的html+css知识点
    前端知识回顾
    this、apply/call、bind、闭包、函数、变量复制
    三角形的实现方法(马)
    webpack学习总结(一)
    使用模板引擎artTemplate的几个问题总结
  • 原文地址:https://www.cnblogs.com/taocom/p/2480115.html
Copyright © 2011-2022 走看看