Skip to content
Related Articles

Related Articles

p5.js | show() Function
  • Last Updated : 20 Aug, 2019

The show() function is an inbuilt function which is used to display the current element. Use setting display: block for style purpose.

This function requires p5.dom library. So add the following line in the head section of the index.html file.




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

Syntax:

show()

Parameters: This function does not accepts any parameters.

Below example illustrates the show() function in p5.js:



Example:




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:
show() function

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :