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中不为人知的五种声明Number的方式简要概述
Feb 22 Javascript
jquery 清空file域示例(兼容个浏览器)
Oct 11 Javascript
一行命令搞定node.js 版本升级
Jul 20 Javascript
充分发挥Node.js程序性能的一些方法介绍
Jun 23 Javascript
学习使用Bootstrap输入框、导航、分页等常用组件
May 11 Javascript
Vue学习笔记进阶篇之过渡状态详解
Jul 14 Javascript
vue.js路由跳转详解
Aug 28 Javascript
Vue基于NUXT的SSR详解
Oct 24 Javascript
js使用xml数据载体实现城市省份二级联动效果
Nov 08 Javascript
webpack-dev-server远程访问配置方法
Feb 22 Javascript
对vue中的事件穿透与禁止穿透实例详解
Oct 28 Javascript
vue制作抓娃娃机的示例代码
Apr 17 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
无JS,完全php面向过程数据分页实现代码
2012/08/27 PHP
php编写简单的文章发布程序
2015/06/18 PHP
PHP中foreach()用法汇总
2015/07/02 PHP
PHP记录和读取JSON格式日志文件
2016/07/07 PHP
PHP缩略图生成和图片水印制作
2017/01/07 PHP
tp5.1 框架路由操作-URL生成实例分析
2020/05/26 PHP
php中yar框架实例用法讲解
2020/12/27 PHP
jQuery $.each的用法说明
2010/03/22 Javascript
JQuery中根据属性或属性值获得元素(6种情况获取方法)
2013/01/17 Javascript
jquery实现div拖拽宽度示例代码
2013/07/31 Javascript
jQuery实现渐变弹出层和弹出菜单的方法
2015/02/20 Javascript
javascript实现网页端解压并查看zip文件
2015/12/15 Javascript
JS实现简单的tab切换选项卡效果
2016/09/21 Javascript
AngularJS2中一种button切换效果的实现方法(二)
2017/03/27 Javascript
微信小程序网络请求的封装与填坑之路
2017/04/01 Javascript
node.js学习之事件模块Events的使用示例
2017/09/28 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
基于Node.js的大文件分片上传示例
2019/06/19 Javascript
解决vue项目刷新后,导航菜单高亮显示的位置不对问题
2019/11/01 Javascript
浅析Python中的多进程与多线程的使用
2015/04/07 Python
python读取二进制mnist实例详解
2017/05/31 Python
使用Django实现把两个模型类的数据聚合在一起
2020/03/28 Python
HTML5注册表单的自动聚焦与占位文本示例代码
2013/07/19 HTML / CSS
意大利专业化妆品品牌:KIKO MILANO
2017/02/01 全球购物
Topshop美国官网:英国快速时尚品牌
2019/05/16 全球购物
医学护理系毕业生求职信
2013/10/01 职场文书
应届大学生求职的自我评价
2013/11/17 职场文书
军训心得体会
2013/12/31 职场文书
幼儿教师研修感言
2014/02/12 职场文书
央视元宵晚会主持串词
2014/03/25 职场文书
商务司机岗位职责
2015/04/10 职场文书
2015年法院工作总结范文
2015/04/28 职场文书
分享mysql的current_timestamp小坑及解决
2021/11/27 MySQL
Nginx虚拟主机的配置步骤过程全解
2022/03/31 Servers
基于Apache Hudi在Google云构建数据湖平台的思路详解
2022/04/07 Servers
分析SQL窗口函数之聚合窗口函数
2022/04/21 Oracle