鼠标事件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>鼠标事件</title>

<style type="text/css"> li{ list-style:none; float:left; width:100px; text-align:center; } .heightlight{ background:#099;}</style>

<script src="jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(e) {    

$("#nav li").mouseover(function(e) {   

      $(this).addClass("heightlight");     });

 $("#nav li").mouseout(function(e) {    

     $(this).removeClass();     }); });

</script>

 

</head>

<body>

<div id="nav">

<ul>

<li><a href="#">首页</a></li>

<li><a href="#">服装城</a></li>

<li><a href="#">电器城</a></li>

<li><a href="#">易购超市</a></li>

<li><a href="#">易购团</a></li>

<li><a href="#">在线游戏</a></li>

<li></li> </ul>

</div>

</body>

</html>

posted @ 2016-05-09 10:28  ZR-字母控  阅读(150)  评论(0)    收藏  举报