40. jQuery-使用hover（）方法切換事件
阿新 • • 發佈：2018-12-31
1.效果圖
2.html程式碼
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>40 jQuery-使用hover（）方法切換事件</title> <style type="text/css"> body{font-size:13px} .clsFrame{border:solid 1px #666;width:220px} .clsFrame .clsTitle{background-color:#eee; padding:5px;font-weight:bold} .clsFrame .clsContent{padding:5px;display:none} </style> </head> <body> <div class="clsFrame"> <div class="clsTitle">hover方法</div> <div class="clsContent"> 將滑鼠移到標題時，自動顯示內容；滑鼠移出標題時，關閉顯示的內容。 </div> </div> <script src="../jquery.min.js"></script> <script type="text/javascript"> //第二種方法 $(function(){ $(".clsTitle").hover( function() { $(".clsContent").show(); }, function() { $(".clsContent").hide(); } ); }); </script> </body> </html>