Advanced Search

Stop animations on multiple hovering

/ Published in: JavaScript
Save to your folder(s)
For user-friendly animations on hover event.
Prevents repeating animations when hovering object many many times.

Example needs "jquery.color" plugin for color animations. But you can use any animations you want.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. $('a.coollink').hover(function(){
  2.  
  3.   $(this).stop().animate({	// magic here, stop THIS object to animate
  4.                                 // and do animate from begin	
  5.     backgroundColor: '#21545A', //animate what you want
  6.     color: '#FFF'
  7.   }, 500);
  8.  
  9. }, function(){
  10.  
  11.   $(this).stop().animate({	// magic here, stop THIS object to animate
  12.                                 // and do animate from begin	
  13.     backgroundColor: '#FFF',    //animate what you want
  14.     color: '#797979'
  15.     }, 500);
  16.  
  17. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.