How to use

Include HoldOn.css file !
<link rel="stylesheet" href="HoldOn.css">
Include jQuery !
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
Include HoldOn.js
<script src="HoldOn.js"></script>

We are ready to prevent stupid acts !
DOWNLOAD LATEST VERSION HERE

Quick demos

HoldOn.js Uses SpinKit for the animations

You dont like anything of the previous themes or you want to customize your own theme? No problem !
HoldOn allows you to customize the main content and message ,in the way you want! Test it !

Previous theme achieved with :

    HoldOn.open({
        theme:"custom",
        content:'<img style="width:80px;" src="https://www.google.de/images/bran\n\
        ding/googlelogo/2x/googlelogo_color_272x92dp.png" class="center-block">',
        message:' some cool message for your user here ! Or where the logo is ! Your skills are the only limit.\n\
        <br> <input type="button" value="Close this Cover" onclick="HoldOn.close();">',
        backgroundColor:"#1847B1",
        textColor:"white",
    });

Usage

HoldOn.js is really easy to use.

HoldOn.open(properties);

Initialize hold on without properties locks the ui with the default theme "sk-rect". Those are the availables properties that supports HoldOn.
Only 1 Instance of HoldOn is available in the window.
That means , if you call again the open method, the existing Layout will be deleted.

HoldOn.open({
    theme:"sk-bounce",//If not given or inexistent theme throws default theme sk-rect
    message: "<h4> Put your html here too ! </h4>",
    content:"Your HTML Content", // If theme is set to "custom", this property is available
                                 // this will replace the theme by something customized.
    backgroundColor:"blue",//Change the background color of holdon with javascript
                           // Keep in mind is necessary the .css file too.
    textColor:"white" // Change the font color of the message
});
                                                                                            

HoldOn.close();

Remove the layout that locks the UI. So simple like that !

HoldOn.js