Latest web development tutorials

HTML properti kanvas shadowOffsetX

Kanvas Referensi Obyek objek kanvas

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 正值或负值,定义阴影与形状的水平距离。


Kanvas Referensi Obyek objek kanvas