实例讲解使用HTML5 Canvas绘制阴影效果的方法

context.shadowOffsetX = i*2; context.shadowOffsetY = 0;

context.shadowBlur = i*2; context.fillStyle = "RGBA(127, 127, 127, 1)";

context.fillText("Blur Canvas", 40, 80+hh); }

for(var i = 0; i < 10; i++) {

context.shadowColor = "RGBA(255, 255, 255," + ((10-i)/10) + ")"; context.shadowOffsetX = -i*2;

context.shadowOffsetY = 0; context.shadowBlur = i*2;

context.fillStyle = "RGBA(127, 127, 127, 1)"; context.fillText("Blur Canvas", 40, 80+hh);

} }

</script>

</head> <body>

<h1>HTML5 Canvas Clip Demo - By Gloomy Fish</h1> <pre>Fill And Stroke Clip</pre>