خاصية HTML canvas shadowOffsetX
مثال
ارسم مستطيلاً بظل 20 بكسل إلى اليمين (من الموضع الأيسر للمستطيل):
جافا سكريبت:
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);
دعم المتصفح
تحدد الأرقام الواردة في الجدول إصدار المتصفح الأول الذي يدعم الخاصية بالكامل.
| Property | |||||
|---|---|---|---|---|---|
| shadowOffsetX | Yes | 9.0 | Yes | Yes | Yes |
التعريف والاستخدام
تقوم خاصية shadowOffsetX بتعيين أو إرجاع المسافة الأفقية للظل من الشكل.
shadowOffsetX = 0 يشير إلى أن الظل خلف الشكل مباشرة.
يشير shadowOffsetX = 20 إلى أن الظل يبدأ بمقدار 20 بكسل إلى اليمين (من الموضع الأيسر للشكل).
يشير shadowOffsetX = -20 إلى أن الظل يبدأ بمقدار 20 بكسل إلى اليسار (من الموضع الأيسر للشكل).
نصيحة: لضبط المسافة الرأسية للظل من الشكل ، استخدم خاصية shadowOffsetY .
| القيمة الافتراضية: | 0 |
|---|---|
| بناء جملة JavaScript: | السياق .shadowOffsetX = رقم ؛ |
قيم الملكية
| Value | Description | Play it |
|---|---|---|
| number | A positive or negative number that defines the horizontal distance of the shadow from the shape |
❮ مرجع قماش HTML