HTML Code
<divid="hoverDiv">
hover over me!
</div>
CSS Code
div#hoverDiv {
width: 300px;
height: 100px;
background-color: red;
color: white;
border: 1px solid black;
}
JavaScript Code
$(document).ready(function(){
//this first function inide the hover method
//is for when the mouse enters the element
$('div#hoverDiv').hover(function(){
//set multipleCSS properties at once
$(this).css({
'background-color': 'blue',
'color': 'pink'
});
}, function() {
//set multipleCSS properties at once
$(this).css({
'background-color': 'red',
'color': 'white'
});
});
});