How to realize Photoshop gradual discoloration effect by html5

Editor to share with you html5 how to achieve Photoshop gradual discoloration effect, I hope you will gain something after reading this article, let's discuss it together!

The code is as follows:

HTML5 draws lines, circles, rectangles

Http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">

$(document) .ready (function () {

Var c=document.getElementById ("drawbox")

Var draw=c.getContext ("2d"); / / get a reference to the 2d content and call the drawing API

/ / specify gradient block

Var grd=draw.createLinearGradient (50, 50, 200, 50); / / coordinates, length and width

Grd.addColorStop (0, "black"); / / start color

Grd.addColorStop (1, "green"); / / end color

Draw.fillStyle=grd; / / set to fill pattern

Draw.fillRect (50, 50, 50, 200, 50); / / fill into the rectangle

})

After reading this article, I believe you have a certain understanding of "html5 how to achieve Photoshop gradual discoloration effect". If you want to know more about it, you are welcome to follow the industry information channel. Thank you for reading!