Download
User Rating: 3.8/5 ( 2 votes)
Mad twitter is a highly user friendly button, that produces different animations on hover effect. Six different effects makes the twitter angry and it goes wild, which is the most interesting feature of mad twitter button
Source: topgravity.com
1. INCLUDE CSS AND JS FILES
<link href="css/mad_twitter.css" rel="stylesheet" media="all" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/mad_twitter.js"></script>
2. HTML
<div class="mad_twitter" id="mad_twitter_1">
<ul>
<li id="written">Follow us</li>
<li id="twitter"><center><i class="fa fa-twitter fa-2x"></center></i></li>
</ul>
</div>
3. JAVASCRIPT
$("#mad_twitter_1").hover(function(){
$("#mad_twitter_1 .fa-twitter").toggleClass("magictime foolishIn");
});
4. CHANGE ANIMATION
There are six unique animations and can be chaged as follows;
Insead of using "follishIn" in the above script user can use following animations
-
twisterInDown
-
magic
-
bombLeftOut
-
tinUpIn
-
tinRightOut