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

Be the first to comment

Leave a Reply

Your email address will not be published.

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    Markdown is turned off in code blocks:
     [This is not a link](

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see