خاصية transformOrigin في Style

التعريف والاستخدام

transformOrigin تسمح هذه الخاصية بتغيير موقع العنصر المقلب.

عناصر التحويل 2D يمكنها تغيير محور x وy للعنصر. يمكن لعناصر التحويل 3D أيضًا تغيير محور z.

ملاحظة:يجب أن تكون هذه الخاصية متزامنة مع خاصية transform استخدام معًا.

انظر أيضًا:

مثل Style Object في JavaScript:خاصية transform

دليل CSS:خاصية transform-origin

مثال

إعداد موقع الأساس للعنصر المقلب:

document.getElementById("myDIV").style.transformOrigin = "0 0";

جرب بنفسك

النحو

استرجاع خاصية transformOrigin:

object.style.transformOrigin

إعداد خاصية transformOrigin:

object.style.transformOrigin = "x-axis y-axis z-axis|initial|inherit"

قيمة الخاصية

القيمة وصف
x-axis

يحدد وضع العرض في المحور x. القيم الممكنة:

  • left
  • center
  • right
  • length
  • %
y-axis

يحدد وضع العرض في المحور y. القيم الممكنة:

  • top
  • center
  • bottom
  • length
  • %
z-axis

يحدد وضع العرض في المحور z. القيم الممكنة:

  • length
initial أضف هذه الخاصية إلى قيمتها الافتراضية. انظر initial.
inherit يرث هذه الخاصية من العنصر الأب. انظر inherit.

تفاصيل تقنية

القيمة الافتراضية: 50% 50% 0
القيمة الم返回ة: الخط النصي، يمثل موقع خاصية transform-origin.
إصدار CSS: CSS3

دعم المتصفح

الرقم في الجدول يشير إلى إصدار المتصفح الأول الذي يدعم هذه الخاصية بشكل كامل.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0 10.0 16.0 9.0 23.0