mousePressed()

A function that's called once when a mouse button is pressed.

Declaring the function mousePressed() sets a code block to run automatically when the user presses a mouse button:

function mousePressed() {
  // Code to run.
}

The mouse system variables, such as mouseX and mouseY, will be updated with their most recent value when mousePressed() is called by p5.js:

function mousePressed() {
  if (mouseX < 50) {
    // Code to run if the mouse is on the left.
  }

  if (mouseY > 50) {
    // Code to run if the mouse is near the bottom.
  }
}

The parameter, event, is optional. mousePressed() is always passed a MouseEvent object with properties that describe the mouse press event:

function mousePressed(event) {
  // Code to run that uses the event.
  console.log(event);
}

On touchscreen devices, mousePressed() will run when a user’s touch begins if touchStarted() isn’t declared. If touchStarted() is declared, then touchStarted() will run when a user’s touch begins and mousePressed() won’t.

Browsers may have default behaviors attached to various mouse events. For example, some browsers highlight text when the user moves the mouse while pressing a mouse button. To prevent any default behavior for this event, add return false; to the end of the function.

Note: mousePressed(), mouseReleased(), and mouseClicked() are all related. mousePressed() runs as soon as the user clicks the mouse. mouseReleased() runs as soon as the user releases the mouse click. mouseClicked() runs immediately after mouseReleased().