anchorHoverEffect: jQuery Plugin for CSS3 Animated Anchor Links

anchorHoverEffect is a tiny jQuery plugin that applies fancy CSS3 animations to your anchor links on mouse hover i.e makes you anchor tag fancy and animated. Works on all modern browser which support CSS3 transforms and transitions. Currently, it provides four different types of effects .i.e Roller 3D effect, Flip Effect, Bracket Effect, and BorderBottom effect.

Download: https://github.com/iSatinderSingh/anchor-hover-effect

Demonstration: https://codepedia.info/Anchor-hover-effect-jquery-plugin.html

Plugin homepage: https://codepedia.info/anchor-hover-effect-jquery-plugin/

Implementation:

First, we need to include anchorHoverEffect.css file in our head tag. Then load anchorHoverEffect.js script after loading jQuery library.

<link href="../anchorHoverEffect.css" rel="stylesheet" type="text/css" />
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="../anchorHoverEffect.js"></script>

Add Html anchor tags whom you want to make it fancy and animated on hover.

<ul class="ulDefault">
 <li><a href="#">jQuery</a></li>
 <li><a href="#">Angular Js</a></li>
 <li><a href="#">JavaScript</a></li>
 <li><a href="#">Asp.net MVC</a></li>
</ul>

Call the function on anchor tag you just added.

$(".ulDefault a").anchorHoverEffect();

Options:

Screenshots: