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 相关文章推荐
jquery 双色表格实现代码
Dec 08 Javascript
深入解析JavaScript中的变量作用域
Dec 06 Javascript
浅谈javascript中的instanceof和typeof
Feb 27 Javascript
JavaScript运动减速效果实例分析
Aug 04 Javascript
javascript实现粘贴qq截图功能(clipboardData)
May 29 Javascript
BootStrap中关于Select下拉框选择触发事件及扩展
Nov 22 Javascript
基于iscroll.js实现下拉刷新和上拉加载效果
Nov 28 Javascript
Vue-cli Eslint在vscode里代码自动格式化的方法
Feb 23 Javascript
react redux入门示例
Apr 19 Javascript
9102年webpack4搭建vue项目的方法步骤
Feb 20 Javascript
小程序云开发实现数据库异步操作同步化
May 18 Javascript
vue组件实现移动端九宫格转盘抽奖
Oct 16 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
如何做到多笔资料的同步
2006/10/09 PHP
php 获取客户端的真实ip
2009/11/30 PHP
php中根据某年第几天计算出日期年月日的代码
2011/02/24 PHP
帝国CMS留言板回复后发送EMAIL通知客户
2015/07/06 PHP
JSON.stringify 语法实例讲解
2012/03/14 Javascript
JS方法调用括号的问题探讨
2014/01/24 Javascript
JavaScript模拟重力状态下抛物运动的方法
2015/03/03 Javascript
分享15个大家都熟知的jquery小技巧
2015/12/02 Javascript
探析浏览器执行JavaScript脚本加载与代码执行顺序
2016/01/12 Javascript
js实现微博发布小功能
2017/01/12 Javascript
详解Jquery EasyUI tree 的异步加载(遍历指定文件夹,根据文件夹内的文件生成tree)
2017/02/11 Javascript
$.browser.msie 为空或不是对象问题的多种解决方法
2017/03/19 Javascript
vue v-model表单控件绑定详解
2017/05/17 Javascript
关于JavaScript中forEach和each用法浅析
2017/07/27 Javascript
Vue的MVVM实现方法
2017/08/16 Javascript
js 原生判断内容区域是否滚动到底部的实例代码
2017/11/15 Javascript
angularJs中$http获取后台数据的实例讲解
2018/08/08 Javascript
js删除数组中某几项的方法总结
2019/01/16 Javascript
js控制随机数生成概率代码实例
2019/03/21 Javascript
优雅的使用javascript递归画一棵结构树示例代码
2019/09/22 Javascript
解决pandas中读取中文名称的csv文件报错的问题
2018/07/04 Python
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
2018/10/22 Python
解决Python selenium get页面很慢时的问题
2019/01/30 Python
Python上下文管理器用法及实例解析
2019/11/11 Python
详解Python可视化神器Yellowbrick使用
2019/11/11 Python
Python连接Impala实现步骤解析
2020/08/04 Python
详解pycharm2020.1.1专业版安装指南(推荐)
2020/08/07 Python
一款利用html5和css3实现的3D滚动特效的教程
2015/01/04 HTML / CSS
HTML5 Web缓存和运用程序缓存(cookie,session)
2018/01/11 HTML / CSS
班组长竞聘书
2014/03/31 职场文书
村支部书记群众路线对照检查材料思想汇报
2014/10/08 职场文书
党的群众路线教育实践活动个人对照检查材料(医生)
2014/11/05 职场文书
2015年骨干教师工作总结
2015/05/26 职场文书
自荐信大全
2019/03/21 职场文书
JavaWeb实现显示mysql数据库数据
2022/03/19 Java/Android
Python+Tkinter制作专属图形化界面
2022/04/01 Python