Css3 бібліотека - 40+ ефектів при наведенні

CSS3 бібліотека - 40+ ефектів при наведенні

Щоб привернути увагу користувачів є багато способів: починаючи від найбільш набридливих і лякають, я маю на увазі спливаючі вікна, які не можна закрити і переадресовують на інші сайти, і більш простих, таких як цікаве виділення посилання. Ось останній випадок ми і розглянемо в цьому уроці. У цьому уроці ми розглянемо спеціальну бібліотеку написану на CSS3, яка дозволяє виділяти посилання при наведенні на неї. А це робить більш інтерактивний зв`язок з користувачем.

Відео: Woocommerce Shop Hover Effects Супер ефекти плагін CSS3

За посиланнями, розташованим нижче, ви можете подивитися приклади, а також завантажити демо версію:

Подивитися прімерСкачать

Як користуватися? - 40+ ефектів при наведенні

HTML частина

Можливо розробники цієї бібліотеки іноді оновлюють її, тому рекомендую скачати її звідси - перейти (Останню версію).

Відео: Animate.css - при наведенні на елемент

Вам потрібен файл hover-min.css - це зменшена версія бібліотеки. Його необхідно підключити на початку вашого сайту:

12345


lt;headgt; ..lt;link href="Путь_до_файла / hover.css" rel="Stylesheet"gt; ..lt;/headgt;

Потім залишилося лише додати ефект для нашого лінку. Наприклад ось код нашого лінку:

1
lt;a href="#" class="Btn"gt; Кнпокаlt;/agt;

Стиль для прикладу я вибрав ось такий:

width = "650" height = "117" alt = "Анімація при наведенні на посилання" class = «alignnone size-full wp-image-3373" / gt;

висновок

Ще один непоганий набір ефектів які можна використовувати у своїх проектах. А все що потрібно - це підключити бібліотеку CSS3!

Також про ефекти при наведення на посилання вам будуть цікаві такі статті:

  • Приголомшливі ефекти CSS3 при наведенні
  • Оригінальний ефект CSS3 при наведенні на ...
  • Як красиво оформити посилання

Успіхів!

З повагою, Юрій Німець

Поділися в соц мережах:
Cхоже

Увага, тільки СЬОГОДНІ!