JS實(shí)現(xiàn)自定義狀態(tài)欄動(dòng)畫文字效果示例

更新時(shí)間：2017年10月12日 12:07:08 作者：第十七簽

這篇文章主要介紹了JS實(shí)現(xiàn)自定義狀態(tài)欄動(dòng)畫文字效果,涉及javascript結(jié)合時(shí)間函數(shù)動(dòng)態(tài)設(shè)置IE狀態(tài)欄文字顯示效果相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)自定義狀態(tài)欄動(dòng)畫文字效果。分享給大家供大家參考，具體如下：

在IE瀏覽器中打開，顯示動(dòng)態(tài)文字的效果，主要瀏覽器左下角的文字。

<body onload="stack();">
  <script type="text/javascript">
    var statusText="自定義動(dòng)畫狀態(tài)欄文字";
    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>

運(yùn)行效果：

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript圖形繪制技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JavaScript實(shí)現(xiàn)滑塊驗(yàn)證解鎖
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)滑塊驗(yàn)證解鎖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01
淺談JS中幾種輕松處理''this''指向方式
這篇文章主要介紹了淺談JS中幾種輕松處理'this'指向方式，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
JS中作用域以及變量范圍分析
這篇文章主要介紹了JS中作用域以及變量范圍分析,需要的朋友可以參考下
2020-07-07
從數(shù)組中隨機(jī)取x條不重復(fù)數(shù)據(jù)的JS代碼
這篇文章主要介紹了從數(shù)組中隨機(jī)取x條不重復(fù)數(shù)據(jù)的JS代碼，有需要的朋友可以參考一下
2013-12-12
js異或運(yùn)算符^小技巧分享
這篇文章主要介紹了js異或運(yùn)算符^小技巧，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-04-04
Javascript 判斷兩個(gè)IP是否在同一網(wǎng)段實(shí)例代碼
javascript功能的強(qiáng)大之處是我們大家有目共睹的，幾天小編向大家介紹Javascript 判斷兩個(gè)IP是否在同一網(wǎng)段，感興趣的朋友可以參考一下
2016-11-11
javascript頁面倒計(jì)時(shí)實(shí)例
這篇文章主要介紹了javascript頁面倒計(jì)時(shí)實(shí)現(xiàn)方法,可實(shí)現(xiàn)簡單的頁面倒計(jì)時(shí)及自動(dòng)提交表單功能,非常簡單實(shí)用,需要的朋友可以參考下
2015-07-07
javascript滾輪控制模擬滾動(dòng)條
這篇文章主要為大家詳細(xì)介紹了javascript滾輪控制模擬滾動(dòng)條的相關(guān)資料,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
微信小程序按鈕點(diǎn)擊動(dòng)畫效果的實(shí)現(xiàn)
這篇文章主要介紹了微信小程序按鈕點(diǎn)擊動(dòng)畫效果的實(shí)現(xiàn),本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2019-09-09
原生javascript獲取元素樣式
這篇文章主要介紹了原生javascript獲取元素樣式的方法,需要的朋友可以參考下
2014-12-12