Thuộc tính HTML canvas shadowOffsetX
Thí dụ
Vẽ một hình chữ nhật với bóng đổ 20 pixel ở bên phải (từ vị trí bên trái của hình chữ nhật):
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);
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
| Property | |||||
|---|---|---|---|---|---|
| shadowOffsetX | Yes | 9.0 | Yes | Yes | Yes |
Định nghĩa và Cách sử dụng
Thuộc tính shadowOffsetX đặt hoặc trả về khoảng cách ngang của bóng so với hình dạng.
shadowOffsetX = 0 cho biết bóng đổ ở ngay sau hình dạng.
shadowOffsetX = 20 chỉ ra rằng bóng đổ bắt đầu 20 pixel ở bên phải (từ vị trí bên trái của hình dạng).
shadowOffsetX = -20 cho biết bóng đổ bắt đầu cách bên trái 20 pixel (từ vị trí bên trái của hình dạng).
Mẹo: Để điều chỉnh khoảng cách dọc của bóng từ hình dạng, hãy sử dụng thuộc tính shadowOffsetY .
| Giá trị mặc định: | 0 |
|---|---|
| Cú pháp JavaScript: | ngữ cảnh .shadowOffsetX = number ; |
Giá trị tài sản
| Value | Description | Play it |
|---|---|---|
| number | A positive or negative number that defines the horizontal distance of the shadow from the shape |
❮ Tham chiếu HTML Canvas