JS实现自定义状态栏动画文字效果示例

 更新时间:2017年10月12日 12:07:08   作者:第十七签  
这篇文章主要介绍了JS实现自定义状态栏动画文字效果,涉及javascript结合时间函数动态设置IE状态栏文字显示效果相关操作技巧,需要的朋友可以参考下

本文实例讲述了JS实现自定义状态栏动画文字效果。分享给大家供大家参考,具体如下:

在IE浏览器中打开,显示动态文字的效果,主要浏览器左下角的文字。

<body onload="stack();">
  <script type="text/javascript">
    var statusText="自定义动画状态栏文字";
    var out="";
    var pause=100;
    var animateWidth=20;
    var position=animateWidth;
    var i=0;
    var stack=function(){
      if(statusText.charAt(i)!=" "){
        out="";
        for(var j=0;j<i;j++){
          out+=statusText.charAt(j);
        }
        for(j=i;j<position;j++){
          out+=" ";
        }
        out+=statusText.charAt(i);
        for(j=position;j<animateWidth;j++){
          out+=" ";
        }      
         window.status=out;
        if(position==i){
          animateWidth++;
          position=animateWidth;
          i++;
        }else{
          position--;
        }
      }else{
      }
      if(i<=statusText.length){
        setTimeout("stack()",pause);
      }
    }
  </script>
</body>

运行效果:

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript动画特效与技巧汇总》、《JavaScript图形绘制技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结

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

相关文章

  • P3P Header解决Cookie跨域的问题

    P3P Header解决Cookie跨域的问题

    P3P Header解决Cookie跨域的问题,需要的朋友可以参考一下
    2013-03-03
  • 微信小程序计算器实现案例详解

    微信小程序计算器实现案例详解

    最近继续玩一些微信小程序的api来做例子,感觉自己可能创造力不很足,只能模仿着别人的例子来做一个自己的计算器了,下面这篇文章主要给大家介绍了关于微信小程序计算器实现案例的相关资料,需要的朋友可以参考下
    2023-06-06
  • js中flexible.js实现淘宝弹性布局方案

    js中flexible.js实现淘宝弹性布局方案

    这篇文章主要为大家详细介绍了js中flexible.js实现淘宝弹性布局方案,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • JavaScript地理位置信息API

    JavaScript地理位置信息API

    这篇文章主要介绍了JavaScript地理位置信息API的相关资料,需要的朋友可以参考下
    2016-06-06
  • js纯数字逐一停止显示效果的实现代码

    js纯数字逐一停止显示效果的实现代码

    下面小编就为大家带来一篇js纯数字逐一停止显示效果的实现代码。小编觉得非常不错。现在分享给大家。给大家一个参考
    2016-03-03
  • javascript中eval函数用法分析

    javascript中eval函数用法分析

    这篇文章主要介绍了javascript中eval函数用法,实例分析了javascript中eval函数的使用技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • JS实现模糊查询带下拉匹配效果

    JS实现模糊查询带下拉匹配效果

    这篇文章主要介绍了JS实现模糊查询带下拉匹配效果,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-06-06
  • JavaScript 事件冒泡应用实例分析

    JavaScript 事件冒泡应用实例分析

    在一些传统的小型WEB应用开发过程中,JavaScript通常只是拿来做表单验证而以,所以你很少会遇到因为JavaScript事件冒泡而影响功能的实现情况,又或者事件冒泡对最终实现效果影响不大,可忽略。
    2010-01-01
  • 不同编码的页面表单数据乱码问题解决方法

    不同编码的页面表单数据乱码问题解决方法

    这篇文章主要介绍了不同编码的页面表单数据乱码问题解决方法,本文使用一个表单不常用属性accept-charset解决了这个问题,需要的朋友可以参考下
    2015-02-02
  • 还不懂递归?读完这篇文章保证你会懂

    还不懂递归?读完这篇文章保证你会懂

    你还不懂递归?读完这篇文章保证你会懂,下面这篇文章主要给大家介绍了关于递归的相关内容,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-07-07

最新评论