当前位置: 移动技术网 > IT编程>开发语言>JavaScript > JavaScript通过改变文字透明度实现的文字闪烁效果实例

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

2018年05月10日  | 移动技术网IT编程  | 我要评论
本文实例讲述了javascript通过改变文字透明度实现的文字闪烁效果。分享给大家供大家参考,具体如下: 运行效果图如下: 完整实例代码如下: <h

本文实例讲述了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遍历算法与技巧总结》、《javascript查找算法技巧总结》、《javascript动画特效与技巧汇总》、《javascript错误与调试技巧总结》、《javascript数据结构与算法技巧总结》及《javascript数学运算用法总结

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

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网