Join Joseph Lowery for an in-depth discussion in this video Crafting linear gradients, part of Creating Photo Card Titles with HTML5.
Maybe I just have a low threshold for excitement, but the first time I saw…gradient-styled text--I think it was in a Photoshop tutorial--I…distinctly remember going "Ooh!"…In this lesson we're going to put that functionality into your site visitors'…hands, with a lot more interactivity and a lot fewer steps than that old PS2, I…can guarantee you that.…Any HTML we need is already in place, so let's go directly to the…canvas_custom.js file found in the Chapter 4/04_02 folder and bring in the…necessary event listeners.…
I'll scroll down to that section, which is getting pretty lengthy at this point, and…I am going to copy the textFillColor one here and I am actually going to put it…right below it, because all I need to change here is I am activating the second…color picker, which is called textFillColor2, so, similarly, we have to change the…function name to textFillColor2Changed, and then we need to add one more, so we…can listen for the fill type.…
So I'll change the ID from my pasted in code to fillType and change the function…
Check out the rest of the HTML5 Projects series.
- Setting up a caption submission form
- Creating basic text entry fields
- Integrating color pickers in the form
- Applying text effects like shadows and gradients