Thuộc tính shadowOffsetX của thẻ canvas HTML
Định nghĩa và cách sử dụng
shadowOffsetX Thuộc tính thiết lập hoặc trả về khoảng cách ngang giữa hình dạng và bóng râm.
shadowOffsetX=0Chỉ ra rằng bóng râm nằm ở dưới cùng của hình dạngshadowOffsetX=20Chỉ ra rằng bóng râm nằm ở 20 điểm ảnh bên phải của vị trí left của hình dạngshadowOffsetX=-20Chỉ ra rằng bóng râm nằm ở 20 điểm ảnh bên trái của vị trí left của hình dạng
Lưu ý:Nếu muốn điều chỉnh khoảng cách dọc từ hình dạng, hãy sử dụng shadowOffsetY Thuộc tính.
Mẫu
Vẽ một hình vuông có bóng râm dịch chuyển sang phải 20 điểm ảnh (từ vị trí left của hình vuông):
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetX=20;
ctx.shadowColor="black";
ctx.fillStyle="blue";
ctx.fillRect(20,20,100,80);
Cú pháp
context.shadowOffsetX=số;
Giá trị thuộc tính
| Giá trị | Mô tả |
|---|---|
| số | Giá trị dương hoặc âm, xác định khoảng cách ngang của bóng với hình dạng. |
Chi tiết kỹ thuật
| Giá trị mặc định: | 0 |
|---|
Hỗ trợ trình duyệt
Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ tính chất này hoàn toàn.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Ghi chú:Trình duyệt Internet Explorer 8 và các phiên bản trước không hỗ trợ yếu tố <canvas>.
