作品第一课----鼠标移入/移除改变样式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> div { width: 200px; height: 200px; background-color: #000; color: #FFF; margin: 0 auto; } .style { border: 10px solid #000; background-color: red; color: yellow; } </style> <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> </head> <body> <div> <p>鼠标移入改变样式,鼠标移除恢复。</p> </div> <script type="text/javascript"> $(document).ready(function(){ $("div").hover( function(){ $(this).addClass("style"); }, function(){ $(this).removeClass("style"); } ); }); // var handlerInOut = function(){ // alert(1) // }; // $('div').bind("mouseenter mouseleave", handlerInOut); //$("div").hover(handlerInOut); </script> </body> </html>