수다닷컴

제가 탭메뉴를 만들고 있는데, 제이쿼리가 잘 되지 않아서 도움을 요청합니다..ㅠㅠ

페이지를 처음 열면 가장 기본적으로 1번의 형태로 모습이 나옵니다.
.depth01에 해당하는 컨텐츠가 보여지는것이죠.. 버튼이미지는 _on.gif 로 되있는 상태구요..

.depth.depth02a 를 마우스로 클릭하면 2번과같이 변화합니다. .depth.depth02a의 이미지가 옆으로 이동하고, .depth01에 해당하는 div는 안보이고 .depth02에 해당하는 컨텐츠 div가 보여지게 됩니다. .depth01 이미지는 _off.gif , .depth02 이미지는 _on.gif

.depth01a 이미지를 클릭하면 다시 1번의 형태로 되는겁니다..

html

ul class=depth
li class=depth01
a href=#nimg src=../common/img/main/bottom_btn01_on.gif alt= //a
div붉은 div컨텐츠/div
/li
li class=depth02
a href=#nimg src=../common/img/main/bottom_btn02_off.gif alt= //a
div초록 div 컨텐츠/div
/li
/ulcss

.bottom_cnt .depth {width:812px;overflow:hidden}
.bottom_cnt .depth .depth01 {padding:9px 4px 45px 1px;float:left}
.bottom_cnt .depth .depth01 div {position:relative}
.bottom_cnt .depth .depth01 div ul {width:512px;overflow:hidden;position:absolute;left:155px;top:-90px}

.bottom_cnt .depth .depth02 {padding:9px 0 30px 510px;border-left:1px dotted #999999;float:left}
.bottom_cnt .depth .depth02 div {position:relative; display:none;}
.bottom_cnt .depth .depth02 div ul {width:470px;overflow:hidden;position:absolute;left:-340px;top:-90px}부탁드립니다..ㅠㅠ

신청하기