Home >Web Front-end >HTML Tutorial >基础的jQuery的题目_html/css_WEB-ITnose
<script> <br /> $(function(){ <br /> $("td").mouseover(function(){ <br /> $(this).addClass("i"); <br /> }); <br /> $("td").mouseout(function(){ <br /> $(this).removeClass(); <br /> }); <br /> }); <br /> </script>
<script></script>
<script> <br /> $(function(){ <br /> $("ul li").hover(function(){ <br /> $(this).addClass("liu"); <br /> }, function(){ <br /> $(this).removeClass("liu"); <br /> }); <br /> }); <br /></script>
ul{background:green;}
ul:after{content:'';display:block;clear: both;}
<style> *{ padding:0px; margin:0px; } li{list-style:none;}.jj ul li{display:block;float:left;padding:0px 5px;background-color:#0ff;}.jj ul li.liu{background-color:#F00;} </style> <script src="js/jquery-1.12.3.js"></script> <script> $(function(){$("ul li").hover(function(){$(this).addClass("liu");}, function(){$(this).removeClass("liu");});});</script> </head> <body><div class="jj" > <ul> <li>首页</li> <li>身边团购</li> <li>美食</li> <li>电影</li> <li>KTV</li> <li>酒店</li> <li>购物</li> </ul></div>
非常的感谢你们!