در سایت های مـدرن انیمیشن ها جایگاه ویژهای پیدا کردهاند ، مخصوصاً انیمیشنهای هاور. اگر طراح سایت باشید خیلی خوب میدانید که روشهای افزودن یک افکت هاور به یک المان در وبسایت بسیار زیاد است. یکی از این روشها ، استفاده از کتابخانههای آماده برای افزودن انیمیشن هاور است. به همین دلیل در این مقـاله از سـری مقـالات آمـوزش طـراحی سـایت از مجموعه AFK می خواهیم بهترین کتابخانه های انیمیشن هـاور CSS و JS را به شمـا عـزیزان معـرفی کنیم. پس تـا انتهای این مقاله همراه ما باشید
کتابخانه انیمیشن CSS Wand
کار کردن با این کتابخانه واقعا ساده است. کافیست روی افکتی که نیاز دارید کلیک کنید تا کدهای مربوطه را به شما نمایش دهد سپس میتوانید آنها را کپی کنید و در پروژه خود به سادگی استفاده کنید
کتابخانه انیمیشن Hover 3D
jQuery Hover 3D یک اسکریپت هاور ساده برای ایجاد افکت هاور سه بعدی است. ایده این کتابخانه تبدیل المانها به فضای سه بعدی با استفاده از CSS3 بـازی با TranslateZ برای فـاصله بیـن عناصـر ، و تشخـیص حـرکت مـاوس بـرای تغییـر مقـدار تبدیل است
کتابخانه انیمیشن Hover CSS
در این کتابخانه به مجموعهای از انیمیشنهای هاور دسترسی خواهید داشت و میتوانید از آنها تقریبا برای هر المانی استفاده کنید ولی خب بهتره که برای المـان هایی مثل دکمه ، لینک ، تصـویر و … از انیمیشنهای این کتابخانه CSS استفاده کنید
کتابخانه انیمیشن Imagehover CSS
همچنین iHover شامل مجموعهای از 35 افکت شناور تصویر است که 20 افکت برای عکسهای کوچک دایرهای و 15 افکت برای عکسهای کوچک در اندازه مربع برای نمایش شرح تصاویر است. به راحتی در هر سایتی پیاده سازی می شود و با بوت استرپ نیز به خوبی کار می کند
کتابخانه انیمیشن Moccasin CSS
کتابخـانه Mocassin CSS مجمـوعه ای از افکت هـای هـاور برای کپشن هـای تصاویر است و کاملا ریسپانسیو است، استفاده از آن ساده است و می توانید آن را بر اساس پروژه خود Customiz کنید
کتابخانه انیمیشن SlipHover
این هم یک کتابخانه دیگر برای هاور کپشن در گالریهای تصاویر و … است که میتوانید به سادگی آن را به پروژه های طراحی سایت خود اضافه کنید و از حالتهای مختلف هاور آن استفاده کنید
2 replies on “بهترین کتابخانه های انیمیشن هاور”
خیلی کاربردی بود. 👍🏻
امیدوارم به کارتون اومده باشه