HTML and CSS Reference
In-Depth Information
Figure 2-35. repeat fill example
Example 2-26. Using the no-repeat, repeat-x, and repeat-y strings
function drawScreen() {
var fillImg = new Image();
fillImg.src = 'fill_20x20.gif';
fillImg.onload = function(){
var fillPattern1 = context.createPattern(fillImg,'no-repeat');
var fillPattern2 = context.createPattern(fillImg,'repeat-x');
var fillPattern3 = context.createPattern(fillImg,'repeat-y');
context.fillStyle = fillPattern1;
context.fillStyle = fillPattern2;
context.fillStyle = fillPattern3;
Each browser will show these patterns in a different manner.
Only Firefox seems to show anything of significance when the repeat-x and repeat-y
strings are used in the repeat parameter. We will cover more examples of filling, as well
as many other uses for bitmap images, in Chapter 4 .
Search WWH ::

Custom Search