Here is an example of how to animate the rollover event of an element using jQuery:
<script src="jquery-1.2.6.js" type="text/javascript"></script>
<script src="jquery.color.js" type="text/javascript"></script>
$(document).ready(function()
{
$(".menuButton").hover(
function()
{
$(this).animate(
{
backgroundColor: "#9D9D9D"
}, 300);
},
function()
{
$(this).animate(
{
backgroundColor: "#BEBEBE"
}, 900);
}
);
});
The above code will select all elements that use my "menuButton" CSS class. This can be any class name, or you can select elements by id, etc.
To be able to set the background color in the animate method, you will need the following jQuery plug-in: http://plugins.jquery.com/project/color.
Subscribe