Install via NPM.
npm install rocket-loader
Note that this module has a dependency Rocket Tools (28kb) which will automatically be installed as well.
Start by including the necessary files.
<head> <link href="rocket-loader/css/loader.min.css" rel="stylesheet" type="text/css"> </head> <body> /* Your content goes here */ <script src="rocket-tools/js/tools.min.js"></script> <script src="rocket-loader/js/loader.min.js"></script> </body>
Below is an example of executing the module complete with required HTML and Javascript.
<div id="example"></div> <button id="remove">Remove Loader</button> <script> const loader = Rocket.loader({ target: '#example', body: 'Loading Something' }); Rocket.event.add('#remove', 'click', () => { loader.remove(); }); </script>
For a more detailed look into the available options, you can read the documentation at https://github.com/chrishumboldt/Rocket-Loader