LineLoader
| <html> | |
| <head> | |
| <style> | |
| .line-loader { | |
| height: 0.25rem; | |
| background: black; | |
| width: 0; | |
| position: absolute; | |
| top: 0; left: 0; | |
| transition: width 0.25s cubic-bezier(1.000, 0.000, 0.000, 1.000); | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="line-loader"></div> | |
| <script type="text/javascript"> | |
| var LineLoader = { | |
| el: document.querySelector('.line-loader'), | |
| to: function(width) { | |
| var el = LineLoader.el | |
| el.style.width = width + '%' | |
| }, | |
| } | |
| setTimeout(() => { | |
| LineLoader.to(30) | |
| }, 250) | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment