首页>>Jquery文字>>Loading网页加载进度条动画效果 网页加载中效果(2014-05-08)

Loading网页加载进度条动画效果 网页加载中效果

Loading网页加载进度条动画效果 网页加载中效果
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="container">  
  2.     <ul id="progress">  
  3.         <li><div id="layer1" class="ball"></div><div id="layer7" class="pulse"></div></li>  
  4.         <li><div id="layer2" class="ball"></div><div id="layer8" class="pulse"></div></li>  
  5.         <li><div id="layer3" class="ball"></div><div id="layer9" class="pulse"></div></li>  
  6.         <li><div id="layer4" class="ball"></div><div id="layer10" class="pulse"></div></li>  
  7.         <li><div id="layer5" class="ball"></div><div id="layer11" class="pulse"></div></li>  
  8.     </ul>  
  9.     <a class="trigger" href="#">开始/重新加载</a>  
  10. </div>  
  11.   
  12.   
  13.   
  14. <div id="content">  
  15.     <span class="expand"></span>  
  16. </div>  
  17. <a class="triggerFull" href="#">开始/重新加载</a>  
  18.   
  19.   
  20.   
  21. <div class="container">  
  22.     <ul id="loadbar">  
  23.         <li><div id="layerFill1" class="bar"></div></li>  
  24.         <li><div id="layerFill2" class="bar"></div></li>  
  25.         <li><div id="layerFill3" class="bar"></div></li>  
  26.         <li><div id="layerFill4" class="bar"></div></li>  
  27.         <li><div id="layerFill5" class="bar"></div></li>  
  28.         <li><div id="layerFill6" class="bar"></div></li>  
  29.         <li><div id="layerFill7" class="bar"></div></li>  
  30.         <li><div id="layerFill8" class="bar"></div></li>  
  31.         <li><div id="layerFill9" class="bar"></div></li>  
  32.         <li><div id="layerFill10" class="bar"></div></li>  
  33.     </ul>  
  34.     <a class="triggerBar" href="#">开始/重新加载</a>  
  35. </div>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_334.html