Latest web development tutorials

HTML properti kanvas shadowOffsetX

Pedoman kanvas Referensi HTML Pedoman kanvas Referensi HTML

contoh

Menggambar persegi panjang dengan offset ke shading yang tepat 20 piksel (dari posisi kiri persegi panjang):

YourbrowserdoesnotsupporttheHTML5canvastag.

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

Coba »

Dukungan Browser

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome dan dukungan Safari properti shadowOffsetX.

Catatan: 8 dan versi sebelumnya dari Internet Explorer tidak mendukung <canvas> elemen.


Definisi dan Penggunaan

shadowOffsetX set properti atau mengembalikan bentuk bayangan dan jarak horizontal.

shadowOffsetX = 0 menunjukkan tepat di bawah bentuk bayangan berada.

shadowOffsetX = 20 menunjukkan bentuk bayangan di kanan kiri posisi 20 piksel.

shadowOffsetX = -20 menunjukkan bentuk bayangan 20-pixel meninggalkan posisi di sebelah kiri.

Tip: Untuk mengatur jarak vertikal dari bayang-bayang dan bentuk, menggunakan shadowOffsetY properti.

default: 0
sintaks JavaScript: konteks.shadowOffsetX = jumlah;

Nilai properti

描述
number 正值或负值,定义阴影与形状的水平距离。


Pedoman kanvas Referensi HTML Pedoman kanvas Referensi HTML