Esempio
Disegnare un rettangolo con un'ombra posizionato 20 pixel sotto posizione superiore del rettangolo:
JavaScript:
var c=document.getElementById("myCanvas");
var
ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="red";
ctx.fillRect(20,20,100,80); Prova tu stesso " Supporto browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| shadowOffsetY | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Definizione e l'utilizzo
Gli insiemi di proprietà shadowOffsetY o restituisce la distanza verticale dell'ombra dalla forma.
shadowOffsety = 0 indica che l'ombra è proprio dietro la forma.
shadowOffsetY = 20 indica che l'ombra avvia 20 pixel sotto posizione di inizio della forma.
shadowOffsetY = -20 indica che l'ombra avvia 20 pixel sopra posizione di inizio della forma.
Tip: Per regolare la distanza orizzontale dell'ombra dalla forma, utilizzare la shadowOffsetX struttura.
| Valore di default: | 0 |
|---|---|
| sintassi JavaScript: | context .shadowOffsetY= number ; |
I valori delle proprietà
| Valore | Descrizione | Gioca |
|---|---|---|
| number | Un numero positivo o negativo che definisce la distanza verticale dell'ombra dalla forma | Gioca " |
<Oggetto Tela