Atribut shadowOffsetX tag HTML canvas

Panduan Referensi Canvas HTML5

Definisi dan penggunaan

shadowOffsetX Atribut mengatur atau mengembalikan jarak horizontal antara bentuk dan bayangan.

  • shadowOffsetX=0 Menunjukkan bahwa bayangan berada di bawah bentuk
  • shadowOffsetX=20 Menunjukkan bahwa bayangan berada 20 pixel di sebelah kanan posisi left bentuk
  • shadowOffsetX=-20 Menunjukkan bahwa bayangan berada 20 pixel di sebelah kiri posisi left bentuk

Petunjuk:Untuk mengatur jarak vertikal dari bentuk, gunakan shadowOffsetY Atribut.

Contoh

Gambar sebuah persegi panjang dengan bayangan yang bergerak ke kanan sebesar 20 pixel (dari posisi left persegi panjang):

Peramban Anda tidak mendukung tag canvas.

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

Coba Sendiri

Syarat

context.shadowOffsetX=number;

Nilai Atribut

Nilai Deskripsi
number Nilai positif atau negatif, menentukan jarak horizontal bayang dengan bentuk.

Detil Teknik

Nilai Default: 0

Dukungan Browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Keterangan:Internet Explorer 8 dan versi yang lebih awal tidak mendukung elemen <canvas>.

Panduan Referensi Canvas HTML5