HTML5 Canvas Example

HTML 5 Canvas provides a way to draw graphics through JavaScript, which is easy to use but powerful. Each canvas element has a context (imagined as a page on the drawing board) in which any graphic can be drawn. Browsers support multiple canvas contexts and provide graphical rendering capabilities through different APIs .

Now let's take a look at the effect first!

The dark black part of the image above is the area where the mouse is located, and we can see the middle area darken. And the outside color turns green.

This one is the effect of the mouse moving somewhere else, and we can see clearly that the outside color has changed. It changes with the movement of the mouse color.

This is the HTML 5 canvas that we're going to talk about today.

This example previews the address: Http://html5demos.com/canvas-grad

(Only Safari, Firefox browser is supported.) Example code can be viewed from the browser to get the source code! ）