세로형 2단 메뉴 - jQuery Study #2 심플 세로형 2단 메뉴 - 단계별 학습 #2 이 글에서는 지난 시간에 이어 기존 코드를 플러그인화 시켜보도록 하겠습니다. JavaScript 기존 단계별 학습 #1에서 진행했던 마크업과 CSS는 동일하며 자바스크립트는 플러그인화 시킨 부분만 보여주도록 하겠습니다. javascript (function($) { // 플러그인 정의 $.fn.accordionMenu = function () { this.each(function (index) { var $this = $(this); var accMenu = new AccordionMenu($this); // n번째 인덱스에 해당하는 메뉴를 선택하는 기능(selectMenu())을 // 사용하기 위해 accordionMenu 플러그인에서 생성한 Accordio.. Web Tech/jQuery 9년 전
세로형 2단 메뉴 - jQuery Study #1 심플 세로형 2단 메뉴 - 단계별 학습 #1 이 포스팅에서는 학습 목적을 위해 생성자(클래스)함수 & 프로토타입을 이용한 세로형 2단 메뉴를 구현해 봅니다. 그리고 사용자 정의 이벤트에 대한 소스도 포함하고 있습니다. HTML 2단 메뉴에 대한 마크업을 다음과 같이 준비합니다. html menu1 sub1-1 sub1-2 sub1-3 menu2 sub2-1 sub2-2 menu3 sub3-1 sub3-2 sub3-3 sub3-4 menu4 CSS 2단 메뉴에 대한 CSS는 다음과 같습니다. css #accordionMenu1 { margin:100px; width:300px; } .acc-menu { position:relative; list-style: none; border:4px solid #eee.. Web Tech/jQuery 9년 전