Atributo shadowOffsetY de Canvas

Definición y uso

shadowOffsetY Atributo que configura o devuelve la distancia vertical entre la forma y la sombra.

  • shadowOffsetY=0 Indica que la sombra está justo 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 posición horizontal de la forma, utiliza shadowOffsetX Atributos.

Ejemplo

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

Tu navegador no admite la etiqueta canvas.

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

Prueba por ti mismo

Sintaxis

context.shadowOffsetY=number;

Valor de atributo

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

Detalles técnicos

Valor predeterminado: 0

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite completamente esta propiedad por primera vez.

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

Notas:Internet Explorer 8 y versiones anteriores no admiten el elemento <canvas>.