Inserting a clickable image

Question

I want to insert a clickable image, that is, if any part of the image is clicked, it will either act like a button element, or more preferably, run a Javascript script.

I was thinking of inserting an image into a button element, but as far as I can tell, that would NOT just make the whole image into a button, but rather insert it into a button box.

How do I make a clickable image, that pulls up a script?

Answer 1

There are lots of ways to do this.

<img id="Img" src="img.jpg" />

Adding an onclick attribute:

<img id="Img" src="img.jpg" onclick="myFunction()" />

Adding onclick event listener from script:

document.getElementById( "Img" ).onclick = function() {
    // img clicked
};

Put image as button background

<input type="button" style="background: url( img.jpg )" />