Esempio
Disegnare un rettangolo con un'ombra posto 20 pixel a destra (dalla posizione di sinistra del rettangolo):
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); Prova tu stesso " Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| shadowOffsetX | sì | 9.0 | sì | sì | sì |
Definizione e utilizzo
Gli insiemi di proprietà shadowOffsetX o restituisce la distanza orizzontale dell'ombra dalla forma.
shadowOffsetX=0 indica che l'ombra è proprio dietro la forma.
shadowOffsetX=20 indica che l'ombra inizia 20 pixel a destra (dalla posizione sinistra della figura).
shadowOffsetX=-20 indica che l'ombra inizia 20 pixel a sinistra (dalla posizione di sinistra della forma).
Suggerimento: per regolare la distanza verticale dell'ombra dalla forma, utilizzare la shadowOffsetY proprietà.
| Valore di default: | 0 |
|---|---|
| sintassi JavaScript: | context.shadowOffsetX=number; |
I valori delle proprietà
| Valore | Descrizione | Gioca |
|---|---|---|
| number | Un numero positivo o negativo che definisce la distanza orizzontale dell'ombra dalla forma | Gioca " |