HTML canvas shadowOffsetYPropiedad

Canvas 对象参考手册Objeto Canvas

Ejemplo

Dibuja un rectángulo con una sombra desplazada 20 píxeles hacia abajo (desde la posición superior del rectángulo):

YourbrowserdoesnotsupporttheHTML5canvastag.

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

Pruébalo »

Soporte del navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome y Safari soportan la propiedad shadowOffsetY.

Nota:Internet Explorer 8 y versiones anteriores no soportan el elemento <canvas>.


Definición y uso

La propiedad shadowOffsetY establece o devuelve la distancia vertical entre la sombra y la forma.

shadowOffsety=0 indica que la sombra está directamente debajo de la forma.

shadowOffsetY=20 indica que la sombra está 20 píxeles por debajo de la posición superior de la forma.

shadowOffsetY=-20 indica que la sombra está 20 píxeles por encima de la posición superior de la forma.

Consejo:Para ajustar la distancia horizontal entre la sombra y la forma, useshadowOffsetXla propiedad.

Valor predeterminado: 0
Sintaxis de JavaScript: context.shadowOffsetY=number;

Valores de la propiedad

Valor Descripción
number Valor positivo o negativo que define la distancia vertical entre la sombra y la forma.


Canvas 对象参考手册Objeto Canvas

Otras extensiones