Thuộc tính shadowOffsetY của thẻ canvas HTML

Tài liệu tham khảo HTML5 Canvas

Định nghĩa và cách sử dụng

shadowOffsetY Thuộc tính thiết lập hoặc trả về khoảng cách thẳng đứng giữa hình dạng và bóng râm.

  • shadowOffsetY=0 Chỉ ra rằng bóng râm nằm chính dưới hình dạng
  • shadowOffsetY=20 Chỉ ra rằng bóng râm nằm 20 điểm ảnh dưới vị trí top của hình dạng
  • shadowOffsetY=-20 Chỉ ra rằng bóng râm nằm 20 điểm ảnh trên vị trí top của hình dạng

Lưu ý:Nếu muốn điều chỉnh khoảng cách từ hình dạng về vị trí ngang, hãy sử dụng shadowOffsetX Thuộc tính.

Mẫu

Vẽ một hình vuông có bóng râm xuống 20 điểm ảnh (từ vị trí top của hình vuông):

Trình duyệt của bạn không hỗ trợ thẻ canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="blue";
ctx.fillRect(20,20,100,80);

Thử ngay

Cú pháp

context.shadowOffsetY=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 thẳng đứng từ bóng đến 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ú：Internet Explorer 8 và các phiên bản sớm hơn không hỗ trợ phần tử <canvas>.

Tài liệu tham khảo HTML5 Canvas