با استفاده از تابع matrix که برای ویژگی transform تعیین می شود می توان کارهایی از قبیل تغییر شکل, مکان و وضعیت یک عنصر را بوسیله یک ماتریس در فضای دو بعدی انجام داد.
مثلا اگر داشته باشیم:
transform: rotate(80deg) translate(50px,25px) skewX(10deg);
معادلش یک ماتریس دو بعدی به صورت زیر خواهد بود:
transform: matrix(0.173648, 0.984808, -0.954189, 0.347296, -15.9378, 53.5816);
قطعا محاسبه چنین ماتریسی آسان نیست. خوشبختانه ابزاری برای محاسبه آن ساخته شده است که آدرس آن را در زیر مشاهده می کنید. فقط کافی است توابع transform را در محیط مشخص شده نوشته و دکمه قرمز را بزنید:
اگر با توابع transform آشنایی ندارید به این آدرس مراجعه کنید.
مجتبی جان، علت وجود این تابع ماتریکس چیه؟ وقتی حالت اول هست، استفاده از ماتریکس چه مزیتی داره؟
مرسی.
به نظر. پاسخ اینه که ماتریکس حالت خلاصه شده، Shorthand رو ارائه میده که مزیت های خودش رو داره، از جمله کاهش حجم فایل و …
هر چند باید توسط ابزار های خودش ، اندازه هاش تعیین بشه.
جدا از اختصار نویسی, دقت این تابع بالاتره. یعنی اگر طرحی داریم که تغییر شکل ها و تغییر مکان های ظریفی داره بهتره از این تابع استفاده بشه. یه نکته دیگه اینکه توی جاوااسکریپت یه تابع است به اسم getComputedStyle که مشخصات transform یک عنصر رو به صورت ماتریس بر می گردونه. وجود اینگونه توابع باعث میشه تا به matrix نیاز داشته باشیم. (نمونش یکی از همکارای خودم الان روی پروژه ای کار میکنه که با این تابع کارشو پیش می بره)
بسیار عالی. ممنون.