Thursday, July 4, 2024
HomeLanguagesJavascriptp5.js cursor() Function

p5.js cursor() Function

The cursor() function in p5.js is used to set the cursor to a predefined symbol or an image or it makes visible if already hidden. To set an image as the cursor, the recommended size is 16×16 or 32×32 pixels. The values for parameters x and y must be less than the dimensions of the image.

Syntax:

cursor(type, x, y)

Parameters: This function accepts three parameters as mentioned above and described below:

  • type: This parameter stores the type of cursor like ARROW, CROSS, HAND, MOVE, TEXT and WAIT Native CSS properties: ‘grab’, ‘progress’, ‘cell’ etc. External: path for cursor’s images (Allowed File extensions: .cur, .gif, .jpg, .jpeg, .png).
  • x: This parameter stores the horizontal active spot of the cursor.
  • y: This parameter stores the vertical active spot of the cursor.

Below program illustrates the cursor() function in p5.js:

Example: This example uses cursor() function to display the cursor.




function setup() {
    
    // Create canvas
    createCanvas(400, 400);
      
    // Set the text size
    textSize(40); 
      
    // Set the text alignment
    // to center
    textAlign(CENTER);
}
  
function draw() {
}


Output:

Reference: https://p5js.org/reference/#/p5/cursor

Calisto Chipfumbu
Calisto Chipfumbuhttp://cchipfumbu@gmail.com
I have 5 years' worth of experience in the IT industry, primarily focused on Linux and Database administration. In those years, apart from learning significant technical knowledge, I also became comfortable working in a professional team and adapting to my environment, as I switched through 3 roles in that time.
RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments