canvas 圆形心跳
canvas点击之后缩放,模拟心脏跳动的效果
window.onload = function() { var canvas = document.getElementById("canvas"); var obj = canvas.getContext('2d'); obj.arc(200, 200, 50, 0, 360); obj.stroke(); var angle = 0; canvas.onclick = function(e) { var mx = e.layerX; var my = e.layerY; if(obj.isPointInPath(mx, my)) { setInterval(function() { obj.clearRect(0, 0, 600, 600); angle += 0.2; obj.beginPath(); obj.arc(200, 200, 50 + 10 * Math.sin(angle), 0, 2 * Math.PI); obj.stroke(); }, 50); }; }; };