چند نکته یواشکی این منوها رو من تقریبا سه سال پیش ساختم پس از لحاظ performance تاییدشون نمی کنم. صرفا اینجا برای دوستان معرفی شده تا ایده بگیرند. البته بهینه کردنشون هم کاری نداره به مرور وقت کنم درستشون می کنم. من طراح نیستم. این ها رو اون زمان تصویرشون رو دیدم و یا یهویی […]
وسط قرار دادن عناصر در طراحی صفحات وب یکی از موارد رایج می باشد. در این مطلب قصد داریم تقریبا همه شرایطی که برای وسط قرار دادن عناصر بوجود می آیند را بررسی کنیم. این نوشته ترکیبی از مطلب عالی در سایت css-tricks.com و تجربه بنده است. چون موضوع از اهمیت زیادی برخوردار است از […]
کنترل سرعت ترنزیشن ها و انیمیشن ها اگر با این موضوع آشنایی ندارید به مطلب timing function مراجعه کنید. در نسخه های جدید کروم قابلیت کنترل و تغییر این تابع بوسیله نمودار مهیا شده است. کافی است بر روی علامت آیکون نمودار که به رنگ بنفش است کلیک کنید. کنترل انیمیشن ها این […]
قبل از بررسی قابلیت ها بهتر است نگاهی به کانال های مختلف منتشرسازی کروم داشته باشیم. تیم کروم برای اینکه بروز رسانی بهتری داشته باشند و از چند مرحله تست در چند سطح توسط کاربران متفاوت بهره ببرند از کانال های متفاوتی برای انتشار کروم استفاده می کنند. Stable: این کانال کاملا توسط تیم کروم […]
امروزه در دنیای وب تغییر شکل و مکان عناصر از اهمیت زیادی برخوردار است. با استفاده از چنین قابلیت هایی و همینطور انیمیشن ها و ترنزیشن ها صفحات وب و نرم افزارهای کاربردی کاربر پسندتر و پویاتر می شوند و همینطور شادابی خاصی خواهند داشت. با استفاده از سی اس اس می توانیم عناصر را […]
با استفاده از تابع matrix که برای ویژگی transform تعیین می شود می توان کارهایی از قبیل تغییر شکل, مکان و وضعیت یک عنصر را بوسیله یک ماتریس در فضای دو بعدی انجام داد. مثلا اگر داشته باشیم: transform: rotate(80deg) translate(50px,25px) skewX(10deg); معادلش یک ماتریس دو بعدی به صورت زیر خواهد بود: transform: matrix(0.173648, 0.984808, […]
از ویژگی transform-origin برای تعیین مبدا مختصاتی تغییر شکل, مکان و یا وضعیت عناصر استفاده می شود. مثلا در مورد چرخاندن یک عنصر, اگر مبدا مختصاتی آن عنصر تغییر پیدا کند نتیجه تغییر چرخش متفاوت خواهد بود. تصویر زیر این موضوع را بهتر بیان می کند. توجه داشته باشید که نقطه سیاه مبدا مختصات عنصر […]
با استفاده از تابع skewY که برای ویژگی transform تعیین می شود می توانید یک عنصر را در فضای دو بعدی به صورت کج یا مورب تغییر شکل دهید. می توانید اینطور تصور کنید زمانی که زاویه این تابع مثبت است راس بالا سمت چپ مستطیل و راس پایین سمت راست آن در جهت مخالف […]
با استفاده از تابع skewX که برای ویژگی transform تعیین می شود می توانید یک عنصر را در فضای دو بعدی به صورت کج یا مورب تغییر شکل دهید. می توانید اینطور تصور کنید زمانی که زاویه این تابع مثبت است راس بالا سمت چپ مستطیل و راس پایین سمت راست آن در جهت مخالف […]
با استفاده از تابع skew که برای ویژگی transform تعیین می شود می توانید یک عنصر را در فضای دو بعدی به صورت کج یا مورب تغییر شکل دهید. می توانید اینطور تصور کنید که دو راس رو به روی یک مستطیل را گرفته و در جهت مخالف هم بکشید. در نتیجه مستطیل تبدیل به […]
