Posted By

fredaudet on 07/18/08


Tagged

mouseover mootools rollover


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

nickdoherty
stephenns


Mootools rollOver


 / Published in: JavaScript
 

  1. <div id="button_gets_rollover_image_in_background">
  2. <a href="#">
  3. <img class="rollover" src="..." />
  4. </a>
  5. </div>
  6.  
  7.  
  8.  
  9.  
  10.  
  11. doRollovers = function(elements) {
  12. elements.each(function(thisel){
  13. var src = thisel.getProperty('src');
  14. src = src.replace('_ro','');
  15. var extension = src.substring(src.lastIndexOf('.'),src.length);
  16. thisel.getParent().getParent().setStyle('background','url('+src.replace(extension,'_ro' + extension)+') no-repeat');
  17. thisel.addEvent('mouseenter', function() { this.fade(0.01); });
  18. thisel.addEvent('mouseleave', function() {
  19. this.fade(1);
  20. });
  21. });
  22. };
  23. doRollovers($$('.rollover'));

Report this snippet  

You need to login to post a comment.