بهترین هاور تصویر برای طراحی سایت

طراحان سایت همواره به دنبال پیدا کردن بهترین ابزار برای طراحی قالب های خود هستند. یکی از بهترین ابزارهای طراحی سایت برای هاور تصویر ابزار imagehover.io  می باشد.

سایت Image Hover ابزار هاور تصویر خود را با استفاده از CSS ارائه داده است. شما فقط کافی است یک فایل CSS را به وب سایت خود اضافه کنید و سپس از کدها و کلاس های مخصوص هاور تصاویر استفاده کنید. این ابزار یکی از بهترین هاور تصویر برای طراحی سایت است.

جهت این منظور به وب سایت imagehover.io مراجعه کنید.

این سایت 44 حالت هاور تصویر را به صورت رایگان عرضه می کنید.

هاور تصویر با CSS

بعد روی گزینه دانلود کلیک کنید.

فایل دمو و فایل های اصلی در فرمت zip قابل دانلود است، بعد از دانلود فایل را از حالت فشرده درآورده و طبق روال زیر عمل می کنیم.

در داخل تگ <head> کد اتصال پرونده imagehover.css را وارد کنید:

<head>
   <link rel="stylesheet" href="css/imagehover.min.css">
</head>

برای ایجاد ساختارهای تصویر و متن از الگوی زیر استفاده می کنیم:

<figure class="imghvr-fade">
 <img src="#">
 <figcaption>
 // Hover Content Show
 </figcaption>
</figure>

برای نمایش حالت های دیگر هاور باید کلاس هاور imghvr-fade را تغییر دهید.