JavaScript通过改变文字透明度实现的文字闪烁效果实例


Posted in Javascript onApril 27, 2017

本文实例讲述了JavaScript通过改变文字透明度实现的文字闪烁效果。分享给大家供大家参考,具体如下:

运行效果图如下:

JavaScript通过改变文字透明度实现的文字闪烁效果实例

完整实例代码如下:

<html>
<head>
<meta charset="utf-8">
<title>JS文字闪烁</title>
    <style type="text/css">
      .title
      {
        font-size:50px;
        font-family:Arial black;
        filter:alpha(opacity=10);
      }
    </style>
    <script type="text/javascript">
      function $(id)
      {
        return document.getElementById(id);
      };
      function changeOpacity()
      {
        var direction=-1;
        var opacityValue=100;
        function doChange()
        {
          if(++opacityValue>=100)
          {
            direction=-1;
          }
          if(--opacityValue<=0)
          {
            direction=1;
          }
          opacityValue+=direction;
          $("t1").style.filter="alpha(opacity="+opacityValue+")";
          $("t1").style.opacity=opacityValue/100;
        };
        setInterval(doChange,10);
      };
    </script>
  </head>
  <body onload="changeOpacity()">
    <table id="t1" class="title"><tr><td>Hi,I'm content for text</tr></table>
  </body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript中获取选中对象的类型
Apr 02 Javascript
JavaScript学习笔记(十)
Jan 17 Javascript
js中格式化日期时间型数据函数代码
Nov 08 Javascript
左侧是表头的JS表格控件(自写,网上没有的)
Jun 04 Javascript
浅析jquery的作用与优势
Dec 02 Javascript
JS简单限制textarea内输入字符数量的方法
Oct 14 Javascript
如何使用Bootstrap创建表单
Mar 29 Javascript
详解node中创建服务进程
May 09 Javascript
JavaScript字符串_动力节点Java学院整理
Jun 27 Javascript
如何编写一个d.ts文件的步骤详解
Apr 13 Javascript
详解为生产环境编译Angular2应用的方法
Dec 10 Javascript
vue-cli中安装方法(图文详细步骤)
Dec 12 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
Apr 27 #jQuery
Three.js的使用及绘制基础3D图形详解
Apr 27 #Javascript
jquery ui sortable拖拽后保存位置
Apr 27 #jQuery
ES5 ES6中Array对象去除重复项的方法总结
Apr 27 #Javascript
JavaScript实现隐藏省略文字效果的方法
Apr 27 #Javascript
Vue自定义图片懒加载指令v-lazyload详解
Dec 31 #Javascript
JavaScript实现反转字符串的方法详解
Apr 27 #Javascript
You might like
Symfony查询方法实例小结
2017/06/28 PHP
Django 中 cookie的使用
2017/08/17 PHP
Javascript实现的鼠标经过时播放声音
2010/05/18 Javascript
DB.ASP 用Javascript写ASP很灵活很好用很easy
2011/07/31 Javascript
跟我学习javascript的var预解析与函数声明提升
2015/11/16 Javascript
深入浅析react native es6语法
2015/12/09 Javascript
详细谈谈javascript的对象
2016/07/31 Javascript
CSS+jQuery实现简单的折叠菜单
2016/12/20 Javascript
微信小程序 详解页面跳转与返回并回传数据
2017/02/13 Javascript
angularJs 表格添加删除修改查询方法
2018/02/27 Javascript
jQuery实现鼠标移到某个对象时弹出显示层功能
2018/08/23 jQuery
浅谈vue方法内的方法使用this的问题
2018/09/15 Javascript
Nodejs调用Dll模块的方法
2018/09/17 NodeJs
详解angular2如何手动点击特定元素上的点击事件
2018/10/16 Javascript
JS栈stack类的实现与使用方法示例
2019/01/31 Javascript
Vue使用NProgress的操作过程解析
2019/10/10 Javascript
javascript实现简单留言板案例
2021/02/09 Javascript
python三元运算符实现方法
2013/12/17 Python
python3实现暴力穷举博客园密码
2016/06/19 Python
对python的bytes类型数据split分割切片方法
2018/12/04 Python
PyQt5 在label显示的图片中绘制矩形的方法
2019/06/17 Python
Python Excel vlookup函数实现过程解析
2020/06/22 Python
HTML5 Canvas旋转动画的2个代码例子(一个旋转的太极图效果)
2014/04/10 HTML / CSS
摩托车和ATV零件、配件和服装的首选在线零售商:MotoSport
2017/12/22 全球购物
传播学毕业生求职信
2013/10/11 职场文书
总经理岗位职责描述
2014/02/08 职场文书
办公室主任竞聘演讲稿
2014/05/15 职场文书
中药学专业毕业生推荐信
2014/07/10 职场文书
忠诚奉献演讲稿
2014/09/12 职场文书
户外活动总结
2015/02/04 职场文书
大学生村官入党自传
2015/06/26 职场文书
男方家长婚礼致辞
2015/07/27 职场文书
你会写请假条吗?
2019/06/26 职场文书
MySQL面试题讲解之如何设置Hash索引
2021/11/01 MySQL
MIME类型中application/xml与text/xml的区别介绍
2022/01/18 HTML / CSS
PHP正则表达式之RCEService回溯
2022/04/11 PHP