Propriedade Canvas shadowOffsetX
Definição e uso
shadowOffsetX Atributo que configura ou retorna a distância horizontal entre a forma e a sombra.
shadowOffsetX=0Indica que a sombra está diretamente abaixo da formashadowOffsetX=20Indica que a sombra está 20 pixels à direita da posição left da formashadowOffsetX=-20Indica que a sombra está 20 pixels à esquerda da posição left da forma
Dica:Para ajustar a distância vertical da forma, use shadowOffsetY Atributos.
Exemplo
Desenhar um retângulo com sombra deslocada para a direita em 20 pixels (a partir da posição left 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="blue";
ctx.fillRect(20,20,100,80);
Sintaxe
context.shadowOffsetX=number;
Valor do atributo
| Valor | Descrição |
|---|---|
| number | O valor positivo ou negativo define a distância horizontal entre a sombra e a forma. |
Detalhes técnicos
| Valor padrão: | 0 |
|---|
Suporte do navegador
Os números na tabela indicam a versão do navegador que suportou a propriedade pela primeira vez.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Notas:O Internet Explorer 8 e versões anteriores não suportam o elemento <canvas>.
