<div class="codetitle"> <span><a style="CURSOR: pointer" data="57096" class="copybut" id="copybut57096" onclick="doCopy('code57096')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code57096"> <br> <br> <br> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <br><title>滑动门切换,jQuery层切换代码</title> <br><script type="text/javascript" src="http://www.jb51.net/ajaxjs/jquery-1.6.2.min.js"></script> <br><script type="text/javascript"> <BR>$(function(){ <BR>$("ul li").each(function(i){ <BR>$(this).hover(function(){ <BR>$(this).addClass("bg").siblings().removeClass("bg"); <BR>$(".div:eq("+i+")").show().siblings(".div").hide(); <BR>}) <BR>}) <BR>}) <BR></script> <br><style type="text/css"> <BR>*{ margin:0; padding:0; font-size:12px;} <BR>ul li{ list-style:none; float:left; background-color:#999; cursor:pointer; width:100px; height:25px; line-height:25px; text-align:center;} <BR>ul li.bg{ background-color:#9F0;} <BR>.clr{ clear:both;} <BR>.div{width:200px; height:60px; background:#666; line-height:60px; text-align:center;} <BR>.none{ display:none} <BR></style> <br> <br> <br><ul> <li class="bg">账户信息</li> <li>邮寄地址</li> </ul> <br><div class="clr"></div> <br><div class="div"> <br>第一个div内容 <br> </div> <br><div class="div none"> <br>第二个div内容 <br> </div> <br> <br> <br> </div>