Exemplo
Desenhe um retângulo com uma sombra colocado a 20 pixels para a direita (a partir da posição esquerda do retângulo):
JavaScript:
var c=document.getElementById("myCanvas");
var
ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetX=20;
ctx.shadowColor="black";
ctx.fillStyle="red";
ctx.fillRect(20,20,100,80); Tente você mesmo " Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente a propriedade.
| Propriedade | |||||
|---|---|---|---|---|---|
| shadowOffsetX | sim | 9 | sim | sim | sim |
Definição e Uso
Os shadowOffsetX conjuntos de propriedades ou retorna a distância horizontal da sombra da forma.
shadowOffsetX=0 indica que a sombra é bem atrás da forma.
shadowOffsetX=20 indica que a sombra começa 20 pixels para a direita (esquerda a partir da posição da forma).
shadowOffsetX=-20 indica que a sombra começa 20 pixels para a esquerda (da posição da esquerda da forma).
Dica: Para ajustar a distância vertical da sombra da forma, use o shadowOffsetY propriedade.
| Valor padrão: | 0 |
|---|---|
| sintaxe JavaScript: | context.shadowOffsetX=number; |
Os valores de propriedade
| Valor | Descrição | Jogue |
|---|---|---|
| number | Um número positivo ou negativo que define a distância horizontal da sombra da forma | Jogue " |