jquery로 구현된 매우 간단한 드롭다운 메뉴입니다. 렌더링초기 효과 마우스 호버 효과 코드 코드 복사 코드는 다음과 같습니다. >< ;script type="text/javascript" src="jquery-1.11.1.js"> <br><br>nav a { <br>text- 장식: 없음 <br>nav > ul > li { <br>float: 왼쪽 <br>padding: 0 0.5em; ><br>nav li ul.sub-menu { <br>display: none; <br>padding-left: 0 !important; <br>} <br><br>.sub-menu li { <br>color : 흰색 <br>} <br><br>.sub-menu li:hover { <br>배경색: 검정색 <br>} <br><br>.sub-menu li:hover a { <br> 색상: 흰색; <br>} <br><br>ul { <br> 목록 스타일: 없음 <br>} <br> 홈 ; sub1 sub2 < /li> sub3> >< ;li>프로그래밍 sub1< /a> sub2 sub3 ;ul class="sub-menu"> sub1 sub2 sub3 $( document).ready(function() { <br>$('nav li').hover(function() { <br>$(this).find('.sub-menu').css('display ', '블록'); <br>}, function() { <br>$(this).find('.sub-menu').css('display', 'none') <br>}) ; <br>}) <br>