اسپات لایت

اسپات لایت کامپوننت ویجت کیت به شما اجازه می دهد تا چینش تصاویرتان را به صورت محو یا باحرکت موس انتخاب کنید ، چینش تصاویر می تواند یک تصویر و یا محتوای HTML باشد. به طور پیشفرض اسپات لایت یک قابلیت برای ویجت کیت است.

ویژگی ها

  • ایجاد تصاویر عالی انیمیشنی
  • پشتیبانی سفارشی تصاویر، HTML و مطالب
  • ۵ حالت نمایش انیمیشن
  • طراحی ریسپانسیو و متناسب با تمامی صفحات نمایش
  • ساخته شده با آخرین ورژن jQuery
  • کاملا سازگار با جوملا و وردپرس

نمونه‌ها

اگر چینش سفارشی تنظیم نشود اسپات لایت به طور پیشفرض حالت محو شدن را در کل تصویر قرار می دهد، اگر یک چینش سفارشی تعریف کنید شما می توانید یک حالت را بین انیمیشن های مختلف انتخاب کنید - محو، پایین، بالا، راست و چپ.

طریقه استفاده

با استفاده از کد HTML5 داده سفارشیdata-spotlight اسپات لایت فعال می شود.

<a data-spotlight="on" href="/mypage.html">
  <img src="/image.jpg" width="180" height="120" alt="" />
</a>

برای ایجاد چینش سفارشی،از عنصر div با کلاس سی اس اس overlay استفاده کنید. شما می توانید پارامتر افکت را با ویژگی داده تنظیم کنید. برای مثال:

<a data-spotlight="effect:bottom;" href="/mypage.html">
  <img src="/image.jpg" width="180" height="120" alt="" />
  <div class="overlay">چینش سفارشی</div>
</a>

شما می توانید حالت پارامتر را تنظیم کنید به صورت محو، پایین، بالا، راست و چپ.