Add Click Event To Canvas Or Make Area Map

I write this html code :

Unfortunately, your browser is currently u

Solution 1:

You can turn canvas into an anchor link by using addEventListener to listen for clicks on the canvas.

Then you can use window.open to open google in a new browser tab.

Also, you need to use image.onload to give your image time to load before using drawing it.

var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");


var img=newImage();
img.onload=function(){
    ctx.drawImage(img,0,0);
    canvas.addEventListener("click",function(){
        window.open("http://google.com");
    });
}
img.src="https://dl.dropboxusercontent.com/u/139992952/stackoverflow/google.jpg";

Share