Add a loading box between web pages

Let’s add a loading box that appears everytime a button with a certain class is clicked and prevent the user to do any operation before it disappears:

css file:

js file:
html file:

Create an image link using jQuery and css

Suppose to have a web site with generic icon for doing some operations.

It would be handy to use a specific class to show the wanted icon, instead of writing several times the same code as below

Solution with jQuery

By using jQuery it’s possible to automatically generate the image inside the anchor.

Put this code on the load event of the document:

whenever you need to display the detail image on a link, the code to write is simple:

Solution with css

Without using jQuery, is a common practice to use the background-image property of css

Create an image link in this way is maybe more clean than using jQuery, although width and height property of the image must be specified