Return to Snippet

Revision: 7351
at July 18, 2008 15:57 by fredaudet


Initial Code
<div id="button_gets_rollover_image_in_background">
  <a href="#">
    <img class="rollover" src="..." />
  </a>
</div>





  doRollovers = function(elements) {
    elements.each(function(thisel){
      var src = thisel.getProperty('src');
      src = src.replace('_ro','');
      var extension = src.substring(src.lastIndexOf('.'),src.length);
      thisel.getParent().getParent().setStyle('background','url('+src.replace(extension,'_ro' + extension)+') no-repeat');
      thisel.addEvent('mouseenter', function() { this.fade(0.01); });
      thisel.addEvent('mouseleave', function() {
        this.fade(1);
      });
    });
  };
  doRollovers($$('.rollover'));

Initial URL

                                

Initial Description

                                

Initial Title
Mootools rollOver

Initial Tags

                                

Initial Language
JavaScript