shadowOffsetX¶

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

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

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

Синтаксис¶

context.shadowOffsetX=число;

Значения¶

Значение по умолчанию: 0

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

Спецификация¶

HTML Living Standard

Пример¶

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

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)

Ссылки¶

shadowOffsetX на MDN