CODEWITHSUNDEEP
javascripthtml
Kelvin
Kelvin

Reputation: 233

Why is my javascript code not running? canvas and javascript events

My javascript code is not running, but the html drawing the canvas is..... Im trying to add an event listener on a canvas html element. Each time i click the element its supposed to give me an alert. Ive tried this on firefox and google chrome.

<script language = "javascript" type = "text/javascript">

alert("yo");
canvas.addEventListener('click', function() {}, false);



var elem = document.getElementById("checkersq"),
elemLeft = elem.offsetLeft,
elemTop = elem.offsetTop,
context = elem.getContext('2d'),
elements = [];

elem.addEventListener('click', function(event){

    var x = event.pageX - elemLeft, 
        y = event.pageY - elemTop;

    elements.forEach(function(element){

        if (y > element.top && y < element.top + element.height
            && x > element.left && x < element.left + element.width){

                    alert('clicked an element');

            }

        }   
    });
}, false);

elements.push({
    colour: '#05EFFF',
    width: 150,
    height: 200,
    top: 20,
    left: 15
});

elements.forEach(function(element) {

    context.fillStyle = element.colour;
    context.fillRect(element.left, element.top, element.width, element.height);
});

Upvotes: 0

Views: 69

Answers (1)

Mostafa Shahverdy
Mostafa Shahverdy

Reputation: 2725

convert 

}   
    });
}, false);

to 

    });
}, false);

Upvotes: 2

Related Questions