Clear the canvas by setting the width or height attribute using JavaScript. - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:canvas

  1. HOME
  2. HTML CSS
  3. HTML Tag
  4. canvas

Description

Clear the canvas by setting the width or height attribute using JavaScript.

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas" width="200" height="200" style="border:1px solid">
Your browser does not support the HTML5 canvas tag.
</canvas><!--from   w  ww  .  ja  va2  s.  c  o  m-->
<br>

<script>

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "blue";
ctx.fillRect(50, 50, 100, 100);

function clearCanvas() {
    c.height = 300;
}

</script>

<button onclick="clearCanvas()">Clear canvas</button>

</body>
</html>

Related Tutorials