Proprietà shadowOffsetX dell'HTML canvas
Definizione e uso
shadowOffsetX Proprietà che imposta o restituisce la distanza orizzontale tra la forma e l'ombra.
shadowOffsetX=0Indica che l'ombra si trova direttamente sotto la formashadowOffsetX=20Indica che l'ombra si trova 20 pixel a destra della posizione left della formashadowOffsetX=-20Indica che l'ombra si trova 20 pixel a sinistra della posizione left della forma
Suggerimento:Per regolare la posizione verticale rispetto alla forma, utilizzare shadowOffsetY Proprietà.
Esempio
Disegna un rettangolo con un'ombra spostata a destra di 20 pixel (dalla posizione left del rettangolo):
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);
Sintassi
context.shadowOffsetX=number;
Valore dell'attributo
| Valore | Descrizione |
|---|---|
| number | Valore positivo o negativo, definisce la distanza orizzontale dell'ombra rispetto alla forma. |
Dettagli tecnici
| Valore predefinito: | 0 |
|---|
Supporto del browser
I numeri nella tabella indicano la versione del browser che supporta completamente questa proprietà.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Nota:Internet Explorer 8 e versioni precedenti non supportano l'elemento <canvas>.
