I use it to show loading image while perform AJAX request.
How does this work?
- Load the JS class and CSS style by putting the code that follows, into the "head" tag of the document.
- Put the id of the element that you want to overlay. It is necessary because the class gets the element by id, and you will have to set it.
- Create an object by specifying the id of the element on which you wish to darken. In this case, I darken the body tag, and it will hide the page.
<script> var overlay = new ItpOverlay("body_id"); overlay.show(); </script>
By show() you put overlay on the element. To remove it must use the method hide().
On the demo page, you will find several ways for using. You will see how to use it with AJAX request and full page overlaying.