jquery之hover鼠标在div上实例：

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'

       });

   });

});