Site Notice

hello, world

Progress

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

<html> <button onclick="$('.progress').addClass('done')">开始</button> <button onclick="$('.progress').removeClass('done')">重置</button> <div class="progress">

 <div class="bar"></div>

</div>

<script>

</script> <style>

 .progress {
   width: 80%;
   margin: auto 10%;
   height: 1em;
   border: 1px solid #c5c5c5;
   padding: 2px;
 }
 .progress .bar {
   height: 100%;
   width: 0%;
   background: #a3a2a2;
   transition: width 3s ease-in-out;
 }
 .progress.done bar {
   width: 100%;
 }

</style>

</html>