HTML-Canvas shadowOffsetX-Attribute

HTML canvas 参考手册HTML canvas Referenzhandbuch

Beispiele

Zeichnen Sie ein Rechteck mit einem Schatten, der um 20 Pixel nach rechts versetzt ist (von der linken 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.shadowOffsetX=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 Eigenschaft shadowOffsetX.

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

Definition und Verwendung

Die Eigenschaft shadowOffsetX legt den horizontalen Abstand des Schattens von der Form fest oder gibt ihn zurück.

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

shadowOffsetX=20 gibt an, dass sich der Schatten 20 Pixel rechts von der linken Position der Form befindet.

shadowOffsetX=-20 gibt an, dass sich der Schatten 20 Pixel links von der linken Position der Form befindet.

Tipp:Um den vertikalen Abstand des Schattens von der Form anzupassen, verwenden Sie dieshadowOffsetY-Eigenschaft.

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

Eigenschaftswerte

Wert Beschreibung
number Positiver oder negativer Wert, der den horizontalen Abstand des Schattens von der Form definiert.

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