پستی که قصد دارم در آن از افکت های فوق حرفه ای وب در حالت Hover را معرفی کنم .

حالت Hover چیست : این حالت به قدری روتین هست که دیگر نیازی به توضیح ندارم اما برای آن دسته از عزیزانی که نمیدونن توضیج میدم . این حالت را به زمانی میگویند که نشانه گر ماوس را بر روی یک قسمت برده اید و اتفاقی خاص رخ میدهد . مثلا وقتی ما ماوس را بر روی یک لینک میبریم , نشانه گر ماوس شبیه دست انسان میشود یا مثلا هنگامی که ماوس را بر روی یک باکس میبرید , رنگ آن عوض میشود .

و اما میرسیم به معرفی این افکت ها …

به صورت پیش فرض ما با استفاده از css و css3 میتوانیم افکت های زیبایی را در این حالت اعمال نماییم اما با استفاده از آموزش بیان شده در این پست , شما میتوانید از افکت های آماده فوق حرفه ای و جذاب استفاده نمایید .

برای این کار در ابتدا کافیست فایل css آماده مربوط به افکت ها را از اینجا دانلود نمایید .

سپس در پوشه ی سایت خود آپلود کرده و سپس آن را توسط تگ زیر به سایت خود لینک نمایید .

<link href="آدرس فایل hover.css" rel="stylesheet">

حال میتوانید به هر تگی از html که دوست دارید دارای حالت hover با افکت های زیبا شود , اتربیوت class داده و از میان لیست بلند بالایی که در اختیار شما قرار میگیرد , یک افکت را انتخاب نمایید .

نکته 1 : برای اینکه لیست به شما نمایش داده شود , باید از نرم افزار های طراحی وب سایت ( ترجیحا Adobe Dreamveawer ) استفاده کنید .

نکته 2 : تمامی کلاس های این لیست که مربوط به افکت ها می باشد , با کلمه -hvr شروع میشود .

نکته 3 : فایل hover.css دارای کدهای باز می باشد و شما میتوانید در صورت تمایل برای تغییر در افکت ها , سورس این فایل را باز نموده و شروع به تغییر نمایید . ( ترجیحا باید به css3 مسلط باشید )

دموی تمامی افکت ها

پخش اختصاصی

گرداوری و آموزش : وحید مجیدی