Canvas shadowOffsetY eigenschap

Definitie en gebruik

shadowOffsetY Eigenschap instellen of retourneren van de verticale afstand tussen de vorm en de schaduw.

  • shadowOffsetY=0 Geeft aan dat de schaduw zich exact onder de vorm bevindt
  • shadowOffsetY=20 Geeft aan dat de schaduw zich 20 pixels onder de toppositie van de vorm bevindt
  • shadowOffsetY=-20 Geeft aan dat de schaduw zich 20 pixels boven de toppositie van de vorm bevindt

Tip:Gebruik dit om de horizontale positie van de vorm aan te passen: shadowOffsetX Eigenschappen.

Voorbeeld

Teken van een rechthoek met een schaduw die 20 pixels naar beneden verschuift (vanuit de toppositie van het rechthoek):

Uw browser ondersteunt de canvas tag niet.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="blue";
ctx.fillRect(20,20,100,80);

Probeer het zelf uit

Syntax

context.shadowOffsetY=number;

Eigenschapswaarde

Waarde Beschrijving
number Positieve of negatieve waarden definiëren de verticale afstand tussen het schaduw en de vorm.

Technical details

Default value: 0

Browser support

The numbers in the table indicate the first browser version that fully supports this property.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Note:Internet Explorer 8 and earlier versions do not support the <canvas> element.