HTML-Canvas shadowOffsetY-Attribut

HTML canvas 参考手册HTML canvas Referenzhandbuch

Beispiele

Zeichnen Sie ein Rechteck mit einem Schatten, der um 20 Pixel nach unten versetzt ist (von der oberen Position des Rechtecks aus):

Ihr Browser unterstützt das HTML5-Canvas-Tag nicht.

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);

Selbst ausprobieren »

Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome und Safari unterstützen die shadowOffsetY-Eigenschaft.

Hinweis:Internet Explorer 8 und frühere Versionen unterstützen das <canvas>-Element nicht.

Definition und Verwendung

Die shadowOffsetY-Eigenschaft legt den vertikalen Abstand des Schattens von der Form fest oder gibt ihn zurück.

shadowOffsety=0 gibt an, dass sich der Schatten direkt unter der Form befindet.

shadowOffsetY=20 gibt an, dass der Schatten 20 Pixel unterhalb der oberen Position der Form liegt.

shadowOffsetY=-20 gibt an, dass der Schatten 20 Pixel oberhalb der oberen Position der Form liegt.

Tipp:Um den horizontalen Abstand des Schattens von der Form anzupassen, verwenden Sie dieshadowOffsetXEigenschaft.

Standardwert: 0
JavaScript-Syntax: context.shadowOffsetY=number;

Eigenschaftswerte

Wert Beschreibung
number Ein positiver oder negativer Wert, der den vertikalen Abstand des Schattens von der Form definiert.

HTML canvas 参考手册HTML-Canvas-Referenzhandbuch Weitere Erweiterungen