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