Strange behavior when using mouseClicked() and HTML checkbox element

Hello guys, I hope someone of you might be able to explain this problem to me.

I currently use the mouseClicked() event for my p5js script. When I wanted to add a standard HTML checkbox outside of the canvas I realized that it's not being checked or unchecked when you click on it. After a lot of trying around I found out that the reason for the problem is that my mouseClicked() function returned false. Could someone of you explain to me why this error is happening? Why exactly is this function interfering with checking/unchecking a checkbox?

I tried to reproduce it on jsfiddle but couldn't really get it working so I hope that my code below is enough.


<input type="checkbox" id="moveToMouseCB" checked>


function mouseClicked() {

    if (mouseX > 0 && mouseX < width && mouseY > 0 && mouseY < height) {



    return false;

Thank you :)


Sign In or Register to comment.