How to use

The plugin requires a common suffix used for the filename of your rollover images, the default value is "-over". If you prefer a different suffix then you can change the default value at the top of the autoRoll.js script.

someButton.png
someButton-over.png

Simply add the class 'autoRoll' to any image or div you wish to have a rollover effect on. A div will need to have "background-image" defined in a stylesheet.

<img src="someButton.png" class="autoRoll" width="32" height="32" />
<div id="open-button" class="autoRoll"></div>

And then include the file autoRoll.js in your page header and you're done!

<script type="text/javascript" src="autoRoll.js"></script>

You can also call the .autoRoll() function on a single element or a collection of elements;

window.addEvent('domready', function(){
    $('buttonName').autoRoll();
    $$('.someClass').autoRoll();
    $('menu').getChildren().autoRoll();
});

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.