例
影と四角形を描画矩形のトップ位置の下方20個のピクセルを配置：
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); »それを自分で試してみてください ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
| プロパティ | |||||
|---|---|---|---|---|---|
| shadowOffsetY | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
定義と使用法
shadowOffsetYプロパティセットまたは形状から影の垂直距離を返します。
shadowOffsety = 0は影が正しい形状の背後にあることを示しています。
shadowOffsetY = 20は、影が20個のピクセル形状のトップ位置の下方に開始することを示しています。
shadowOffsetY = -20は、影が20個のピクセル形状のトップ位置の上方に開始することを示しています。
Tip:使用し、形状から影の水平距離を調整するにはshadowOffsetXのプロパティを。
| デフォルト値： | 0 |
|---|---|
| JavaScriptシンタックス： | context .shadowOffsetY= number ; |
プロパティ値
| 値 | 説明 | それを再生します |
|---|---|---|
| number | 形状から影の垂直距離を定義する正または負の数 | それを再生します» |
<Canvasオブジェクト