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中继承的一些示例方法与属性参考
Aug 07 Javascript
Function.prototype.bind用法示例
Sep 16 Javascript
JavaScript插件化开发教程 (四)
Jan 27 Javascript
JavaScript中逗号运算符介绍及使用示例
Mar 13 Javascript
jQuery增加和删除表格项目及实现表格项目排序的方法
May 30 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
Nov 22 Javascript
深入探究node之Transform
Jul 20 Javascript
Vue.js中的图片引用路径的方式
Jul 28 Javascript
for循环 + setTimeout 结合一些示例(前端面试题)
Aug 30 Javascript
详解如何在vue项目中引入elementUI组件
Feb 11 Javascript
React diff算法的实现示例
Apr 20 Javascript
OpenLayers3实现图层控件功能
Sep 25 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
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
使用VisualStudio开发php的图文设置方法
2010/08/21 PHP
比较好用的PHP防注入漏洞过滤函数代码
2012/04/11 PHP
php遍历文件夹和文件列表示例分享
2014/03/11 PHP
php函数serialize()与unserialize()用法实例
2014/11/06 PHP
Javascript中的常见排序算法
2007/03/27 Javascript
DOMAssitant最新版 DOMAssistant 2.5发布
2007/12/25 Javascript
js调试工具 Javascript Debug Toolkit 2.0.0版本发布
2008/12/02 Javascript
js实现鼠标点击文本框自动选中内容的方法
2015/08/20 Javascript
微信小程序 rich-text的使用方法
2017/08/04 Javascript
switchery按钮的使用方法
2017/12/18 Javascript
浅析Visual Studio Code断点调试Vue
2018/02/27 Javascript
解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等)
2018/07/26 Javascript
node中的session的具体使用
2018/09/14 Javascript
详解ES6 Symbol 的用途
2018/10/14 Javascript
vue 实现通过vuex 存储值 在不同界面使用
2019/11/11 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
2020/01/04 Javascript
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
vue-calendar-component 封装多日期选择组件的实例代码
2020/12/04 Vue.js
ES6字符串的扩展实例
2020/12/21 Javascript
跟老齐学Python之一个免费的实验室
2014/09/14 Python
编写Python的web框架中的Model的教程
2015/04/29 Python
利用python如何处理百万条数据(适用java新手)
2018/06/06 Python
pygame游戏之旅 载入小车图片、更新窗口
2018/11/20 Python
Python mutiprocessing多线程池pool操作示例
2019/01/30 Python
PyQt5 文本输入框自动补全QLineEdit的实现示例
2020/05/13 Python
python 如何对logging日志封装
2020/12/02 Python
python中time.ctime()实例用法
2021/02/03 Python
阿联酋航空丹麦官方网站:Emirates DK
2019/08/25 全球购物
有abstract方法的类一定要用abstract修饰吗
2016/03/14 面试题
社区道德讲堂实施方案
2014/03/21 职场文书
目标管理责任书
2014/04/15 职场文书
班级口号大全
2014/06/09 职场文书
2015教师个人德育工作总结
2015/07/22 职场文书
《狼牙山五壮士》读后感:宁死不屈,视死如归
2019/08/16 职场文书
python 解决微分方程的操作(数值解法)
2021/05/26 Python