Javascript свойство shadowOffsetX

Свойство shadowOffsetX устанавливает/возвращает горизонтальное расстояние тени от фигуры.

shadowOffsetX=0 означает, что тень находится непосредственно за фигурой.
shadowOffsetX=20 означает, что тень начинается в 20 пикселях вправо от левого края фигуры.
shadowOffsetX=-20 означает, что тень начинается в 20 пикселях влево от левого края фигуры.

Примечание: Чтобы задать вертикальное расстояние тени от фигуры, используется свойство shadowOffsetY.

Значение по умолчанию: 0
JavaScript синтаксис: context.shadowOffsetX=число;

Возможные значения

Значение Описание
число Положительное или отрицательное число, которое определяет горизонтальное расстояние тени от фигуры

Пример

Нарисуем прямоугольник с тенью, которая будет располагаться в 20 пикселях вправо от его левого края:

Ваш браузер не поддерживает HTML5 тег canvas.

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