jQuery 1.4 Animation Techniques - Index of

Download from Wow! eBook
Canvas Animations
Method Usage
createLinearGradient(a, b, c, d) Creates a linear gradient between two points.
Arguments a and b are the start coordinates of
the gradient, c and d are the end coordinates.
createRadialGradient(a, b, c, d, e, f) Creates a radial gradient between two circles.
Arguments a and b are the start coordinates,
and c is the radius of the first circle. Arguments
d and e are the start coordinates of the second
circle, and f is its radius.
addColorStop(a, b) Adds color to a gradient. The first argument is a
decimal between 0.0 and 1.0 and is the relative
position within the gradient to add the color.
The second argument is the color to use.
The drawImage() and createPattern() methods are very similar in that they are both
used to draw an image on the . The difference is that the pattern is repeated. The
gradient methods return a gradient object which can then be used as the fill or stroke style
for a shape.
Text
Text strings can be written to the canvas, but there is little styling we can perform on them
as there is no associated box model with the text so that means no padding, margins, or
borders. Although, we can set the font and alignment (and the fill color or stroke color using
other properties). API methods include:
Method Usage
fillText(a, b, c) Creates solid text strings on the . The first argument is
the text to write and arguments b and c are the start coordinates of
the text.
measureText(a) Measures the specified text string and returns a metrics object with
a width property.
stroketext(a, b, c) Creates outline text strings on the . The first argument is
the text to write and arguments b and c are the start coordinates of
the text.
[ 270 ]