How to set the javascript gradient background in HTML

[DarenHawk]

A gradient background effect will display your selected HTML background colors in ascending or descending color variations, and also the problem is when we use the <canvas> tag to manipulate an image or a graphic, it is treated in HTML as an inline object (similar to a super-charged <img>). I've made this with photoshop but when I want to add it to my site, it doesn't give the effect I want. This powerful HTML code effect can be used to give your web pages a unique look and feel. However, it must be used very cautiously.

[Khushal]

When you use the <canvas> tag to manipulate an image or a graphic, it is treated in HTML as an inline object (similar to a super-charged <img>). The behavior attaches itself to the onload event and walks through the DOM looking for objects with a class name containing the word "gradient" in the 0th position of the string. To add more colour bands, simply add more sets of parameters to the "createGradient" method calls. To have less colour bands, remove any extra "createGradient" method calls.

[Alejandro]

This script gets around this limitation by using the toDataUrl() function in canvas (supported in Firefox and Opera). toDataUrl() essentially takes the contents of a canvas and turns it into an image, which can then be made into the background of a <div>. Upon finding an object that matches the criteria, it is added to an array which is returned to the caller upon completion.

[RichiRich]

A series of div elements be created and set as children of the element. I wasn't suppost to be a double post, I just hoped to find some guys over here who could wright javascript. The innerHTML of the parent element is copied, placed into a div or span element (depending on if the display of the element is block or inline), The div elements are appended to a documentFragment object and then appended to the parent element for maximum speed of execution.