Site Notice

hello, world

Progress

From Project-EPB Commons
Revision as of 19:17, 21 November 2019 by 机智的小鱼君 (talk | contribs) ([InPageEdit] 没有编辑摘要)

<html> <button onclick="start()">开始</button> <div id="progress" style="width: 80%; margin: auto 10%; height: 1em; border: 1px solid #c5c5c5; padding: 2px"><div id="bar" style="transition: width .1s ease-in-out; height: 100%; width: 0%;background: #a3a2a2;"><span id="num"></span></div></div> <script> function start() {

 var goprogess = setInterval(function () {
   if (typeof x === 'undefined') x = 0;
   x = Number($('#progress #bar').css('width').replace('%','').replace('px',''));
   if (x < 50) {
     x = x + 1;
   } else if (x < 80) {
     x = x + 0.5;
   } else if (x < 90) {
     x = x + 0.25;
   } else {
     x = x + 0.125;
   }
   if (x > 100) {
     clearInterval(goprogess);
     $('#progress').after('<center id="done">DONE</center>');
     $('#progress #bar').delay(3000).css('width','0%');
   } else {
     $('#progress #bar').css('width',x+'%');
     $('#progress #num').text(x);
     $('#done').remove();
   }
 }, 100);

} </script> </html>