<div class="codetitle"> <span><a style="CURSOR: pointer" data="36256" class="copybut" id="copybut36256" onclick="doCopy('code36256')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code36256"> <br><!DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 전환//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br><html xmlns="http://www.w3 .org/ 1999/xhtml"> <br><head> <br><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <br>< title>< ;/title> <br><link href="css/style.css" rel="stylesheet" type="text/css" /> <br><!-- jQuery 소개 --> ; <BR><script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script><br><script type="text/javascript" > <br>//<![CDATA[ <BR>$(function(){ <BR>var $div_li =$("div.tab_menu ul li"); <BR>$div_li.click(function( ){ <BR>$(this).addClass("selected") //현재<li> 요소가 강조 표시됩니다.<BR>.siblings().removeClass("selected") //다른 형제의 높이를 제거합니다. li> elements Liang<br>var index = $div_li.index(this); // 모든 li 요소에서 현재 클릭된 <li> 요소의 인덱스를 가져옵니다. <br>$("div.tab_box > div" ) // 하위 노드를 선택합니다. 하위 노드를 선택하지 않으면 div <br>.eq(index).show() //에 해당하는 <div> 요소가 표시됩니다. <li> element.siblings().hide(); //다른 여러 형제 요소 숨기기 <br>}).hover(function(){ <br>$(this).addClass(" hover"); <br>},function(){ <br>$(this).removeClass("hover"); <br>}) <br>}) <br>//]]> <br> <br> <br><br><div class="tab"> 🎜><ul> <br><li class="selected">시사</li> <br><li>스포츠</li> 🎜>< /ul> <br><div class="tab_box"> <br><div>시사</div> hide"> 스포츠</div> <br><div class="hide">엔터테인먼트</div> <br></div> <br></div> <br><br>< ;/ 본문> <br></html> <br><br> </div>