Interactive Mini Game During Loading - loaderMiniGame

File Size: 16 KB
Views Total: 3041
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Interactive Mini Game During Loading - loaderMiniGame

loaderMiniGame is a customizable jQuery loader plugin which displays an interactive mini game on the loading screen. The plugin will generate a red dot that moves around the loading indicator when mouse hovers and moves. Also can be implemented in pure JavaScript.

How to use it:

1. Load the loaderMiniGame plugin's script after you've load the latest jQuery JavaScript library.

<script src="//"></script>
<script src="jquery-loaderminigame.js"></script>

2. Call the plugin on the target container in which you want to generate the loader mini game.


3. To config the loader mini game, just override the values below and then pass them as an object to the loaderminigame() method.

  loaderBorderSize: "4px",
  loaderBorderColor: "#666",
  loaderOpenBorderColor: "transparent",
  loaderAnimationTimings: ['linear', 'ease', 'ease-in', 'ease-out', 'ease-in-out'],
  baseLoaderBorders: ['NE', 'SE', 'SW'],
  baseLoaderWidth: 20,
  baseLoaderHeight: 20,
  minLoaderSpeed: 1,
  maxLoaderSpeed: 3,

4. Standalone usage:

<script src="loaderminigame.js"></script>
// standalone usage
new loaderminigame(document.getElementById('byId'), {
    // options here

// Note: this just works on the first found match:
new loaderminigame($('.loader_test_2'), {
    // options here


This awesome jQuery plugin is developed by P0rnflake. For more Advanced Usages, please check the demo page or visit the official website.