Skip to content

Instantly share code, notes, and snippets.

@AladinDridi

AladinDridi/emoticone cry by js canvas

Created January 17, 2018 14:56
Show Gist options
  • Save AladinDridi/6f29b7ec61efd68e0abf1e507a4423ae to your computer and use it in GitHub Desktop.
Save AladinDridi/6f29b7ec61efd68e0abf1e507a4423ae to your computer and use it in GitHub Desktop.
Download ZIP
Raw
emoticone cry by js canvas
<html>
<head>
<title>Emoticone cry</title>
<meta charset="utf-8"/>
<style>
canvas{
border :1px dotted blue;
width:600px;
height: 300px;
}
</style>
</head>
<body>
<canvas id="canvas" ></canvas>
<script>
var canvas =document.getElementById('canvas');
if(canvas.getContext){
var ctx=canvas.getContext('2d');
ctx.beginPath();
ctx.fillStyle='yellow';
ctx.arc(100,75,50,0,2*Math.PI);
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.fillStyle='black';
ctx.arc(80,45,8,0,2*Math.PI);
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.fillStyle='black';
ctx.arc(120,45,8,0,Math.PI*2);
ctx.fill();
ctx.closePath();
ctx.beginPath();
ctx.fillStyle='aqua';
ctx.fillRect(115,52,10,35);
ctx.closePath();
ctx.beginPath();
ctx.fillStyle='aqua';
ctx.fillRect(75,52,10,35);
ctx.closePath();
/*ctx.moveTo(240,240);*/
/* ctx.bezierCurveTo(140,50,150,50,150,140);
ctx.lineWidth=10;
ctx.stroke();
ctx.closePath();*/
}
else if(!canvas.getContext){
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment