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 相关文章推荐
用JS操作FRAME中的IFRAME及其内容的实现代码
Jul 26 Javascript
javascript下判断一个元素是否存在的代码
Mar 05 Javascript
JavaScript OOP面向对象介绍
Dec 02 Javascript
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
Feb 12 Javascript
Lua表达式和控制结构学习笔记
Dec 15 Javascript
浅谈javascript中字符串String与数组Array
Dec 31 Javascript
JavaScript返回上一页的三种方法及区别介绍
Jul 04 Javascript
基于jquery实现放大镜效果
Aug 17 Javascript
详解vue与后端数据交互(ajax):vue-resource
Mar 16 Javascript
vue文件运行的方法教学
Feb 12 Javascript
基于 Vue 的 Electron 项目搭建过程图文详解
Jul 22 Javascript
Vue3如何理解ref toRef和toRefs的区别
Feb 18 Vue.js
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
PHP系列学习之日期函数使用介绍
2012/08/18 PHP
php curl上传、下载、https登陆实现代码
2017/07/23 PHP
用JavaScript和注册表脚本实现右键收藏Web页选中文本
2007/01/28 Javascript
ExtJS Grid使用SimpleStore、多选框的方法
2009/11/20 Javascript
input的focus方法使用
2010/03/13 Javascript
bgsound 背景音乐 的一些常用方法及特殊用法小结
2010/05/11 Javascript
js修改input的type属性问题探讨
2013/10/12 Javascript
jQuery使用addClass()方法给元素添加多个class样式
2015/03/26 Javascript
Node.js 异步编程之 Callback介绍(一)
2015/03/30 Javascript
Vue中的ref作用详解(实现DOM的联动操作)
2017/08/21 Javascript
微信小程序实现锚点功能
2019/11/20 Javascript
[01:14:10]2014 DOTA2国际邀请赛中国区预选赛 SPD-GAMING VS Orenda
2014/05/22 DOTA
[01:06:42]VP vs NewBee Supermajor 胜者组 BO3 第二场 6.5
2018/06/06 DOTA
[01:17]炒鸡美酒第四天TA暴走
2018/06/05 DOTA
使用PYTHON创建XML文档
2012/03/01 Python
python使用xmlrpc实例讲解
2013/12/17 Python
Python 专题四 文件基础知识
2017/03/20 Python
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
Python jieba库用法及实例解析
2019/11/04 Python
Ubuntu下Python+Flask分分钟搭建自己的服务器教程
2019/11/19 Python
Python3标准库之threading进程中管理并发操作方法
2020/03/30 Python
Python轻量级web框架bottle使用方法解析
2020/06/13 Python
美国特价机票专家:Airfarewatchdog
2018/01/24 全球购物
李维斯牛仔裤英国官方网站:Levi’s英国
2019/10/10 全球购物
公共事业管理本科生求职信
2013/10/07 职场文书
学生学习总结的自我评价
2013/10/22 职场文书
财务经理岗位职责
2013/11/09 职场文书
寒假思想汇报
2014/01/10 职场文书
社区工作者感言
2014/03/02 职场文书
合作协议书范本
2014/04/17 职场文书
自我推荐信范文
2014/05/09 职场文书
2014迎国庆标语大全
2014/09/19 职场文书
党员批评与自我批评发言稿
2014/10/14 职场文书
2014年驻村干部工作总结
2014/11/17 职场文书
爱护公物主题班会
2015/08/17 职场文书
信息技术研修心得体会
2016/01/08 职场文书