p5.js | hide() Function

The hide() function is an inbuilt function which is used to hide the current element. Essentially display: none is used for this style.
This function requires p5.dom library. So add the following line in the head section of the index.html file. 

javascript

<script language="javascript"
    type="text/javascript" src="path/to/p5.dom.js">
</script>

Syntax:

hide()

Parameters: This function does not accepts any parameters.
Below examples illustrate the hide() function in p5.js:
Example 1: This example uses hide() function to hide the div element. 

javascript

function setup() {

    // Create Canvas of given size
    var cvs = createCanvas(600, 250);
}

function draw() {

  // Set the background color
  background('green');


  // Use createDiv() function to
  // create a div element
  var myDiv1 = createDiv('GeeksforGeeks');

  // Set the position of div element
  myDiv1.position(170, 30);

  // Set the div size
  myDiv1.size(200, 100);

  // Set the font-size of text
  myDiv1.style('font-size', '36px');

  // Use createDiv() function to
  // create a div element
  var myDiv = createDiv('A computer science portal for geeks');

  // Set the position of div element
  myDiv.position(180, 80);

  // Set the div size
  myDiv.size(200, 100);

  // Set the font-size of text
  myDiv.style('font-size', '24px');

  // Set the font-size of text
  myDiv.style('border', '1px solid black');

  // Set the font-size of text
  myDiv.style('text-align', 'center');

  // Set the font color
  myDiv.style('color', 'white');

  // Hide the div element
  myDiv.hide();

}

Output:

Example 2: This example uses hide() and show() function to display the div element. 

javascript

function setup() {

    // Create Canvas of given size
    var cvs = createCanvas(600, 250);
}

function draw() {

  // Set the background color
  background('green');


  // Use createDiv() function to
  // create a div element
  var myDiv1 = createDiv('GeeksforGeeks');

  // Set the position of div element
  myDiv1.position(170, 30);

  // Set the div size
  myDiv1.size(200, 100);

  // Set the font-size of text
  myDiv1.style('font-size', '36px');

  // Use createDiv() function to
  // create a div element
  var myDiv = createDiv('A computer science portal for geeks');

  // Set the position of div element
  myDiv.position(180, 80);

  // Set the div size
  myDiv.size(200, 100);

  // Set the font-size of text
  myDiv.style('font-size', '24px');

  // Set the font-size of text
  myDiv.style('border', '1px solid black');

  // Set the font-size of text
  myDiv.style('text-align', 'center');

  // Set the font color
  myDiv.style('color', 'white');

  // Hide the div element
  myDiv.hide();

  // Show the div element
  myDiv.show();
}

Output: