메뉴바 도움 부탁드립니다.

막걸링

· 13년 전 · 조회 1575 1575 · 댓글 1 1

메뉴에서 서브메뉴를 누르면 상단메뉴 그라이데이션이 유지 되지 않습니다.
'menu_level_1_over'게 계속 유지가 되어야 하는데 'menu_level_1로 넘어가 버립니다.
꼭 도움 부탁드립니다.

<!DOCTYPE html>
<html>
<head>
<title>메뉴예제</title>

<script type="text/javascript">
function menu_over(a) {
var b = a+'sub'
if(document.getElementById(a).className == 'menu_level_1') {
document.getElementById('menu1').className = 'menu_level_1';
document.getElementById('menu2').className = 'menu_level_1';
document.getElementById('menu3').className = 'menu_level_1';
document.getElementById('menu4').className = 'menu_level_1';
document.getElementById('menu5').className = 'menu_level_1';
document.getElementById('menu6').className = 'menu_level_1';
document.getElementById('menu7').className = 'menu_level_1';
document.getElementById('menu8').className = 'menu_level_1';
document.getElementById(a).className = 'menu_level_1_over';

document.getElementById('menu1sub').className = 'menu_level_2';
document.getElementById('menu2sub').className = 'menu_level_2';
document.getElementById('menu3sub').className = 'menu_level_2';
document.getElementById('menu4sub').className = 'menu_level_2';
document.getElementById('menu5sub').className = 'menu_level_2';
document.getElementById('menu6sub').className = 'menu_level_2';
document.getElementById('menu7sub').className = 'menu_level_2';
document.getElementById('menu8sub').className = 'menu_level_2';
document.getElementById(b).className = 'menu_level_2_over';
}
}

</script>
<style>
@font-face {font-family:NanumGothic; src:url(img/NanumGothic.eot);}

body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
body,input,textarea,select,button,table{font-family:'돋움',Dotum,AppleGothic,sans-serif;font-size:12px}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a{text-decoration:none}
a:hover,a:active,a:focus{text-decoration:underline}

.lnb1 {margin:0 auto;
background:#1F68CA; border:1px solid #1F68CA; width:1000px; height:35px; text-align:left; border-radius: 5px 5px 0 0;
background:#850909 -webkit-gradient(linear, 0% 0%, 0% 100%,from(#5DA0FA), to(#1F68CA));
background:#850909 -moz-linear-gradient(top, #5DA0FA, #1F68CA);
filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#5DA0FA,endColorStr=#1F68CA);
}
.lnb2{margin:0 auto; background:#efefef; border:1px solid #cccccc; width:1000px; height:33px; text-align:left; border-radius: 0 0 5px 5px;}
.menu_level_1 {color:white; font-family:NanumGothic; Font-weight:500; float:left; padding:10px 15px 0 15px; cursor:pointer;}
.menu_level_1_over {color:black; font-family:NanumGothic; Font-weight:500; float:left; background:white; border-radius: 5px 5px 0 0; margin:5px 5px 0 5px; padding:10px 15px 7px 15px; cursor:pointer;}
.menu_level_2 {display:none;}
.menu_level_2_over {display:block;}
.menu_level_2_over div {cursor:pointer; padding:10px; font-family:NanumGothic; padding:10px; cursor:pointer; float:left;}
.menu_level_2_over div:hover {display:block; Font-weight:bold; cursor:pointer;}
</style>
</head>
<body>
<br />
<br />
<br />
<div class="lnb1" style="clear:both;">
<div id="menu1" class="menu_level_1_over" onmouseover="menu_over('menu1')">Menu1</div>
<div id="menu2" class="menu_level_1" onmouseover="menu_over('menu2')"메뉴2</div>
<div id="menu3" class="menu_level_1" onmouseover="menu_over('menu3')">메뉴3</div>
<div id="menu4" class="menu_level_1" onmouseover="menu_over('menu4')">메뉴4</div>
<div id="menu5" class="menu_level_1" onmouseover="menu_over('menu5')">메뉴5</div>
<div id="menu6" class="menu_level_1" onmouseover="menu_over('menu6')">메뉴6</div>
<div id="menu7" class="menu_level_1" onmouseover="menu_over('menu7')">메뉴7</div>
<div id="menu8" class="menu_level_1" onmouseover="menu_over('menu8')">메뉴8</div>
</div>
<div class="lnb2" style="clear:both;">
<div id="menu1sub" class="menu_level_2_over">
<div>메뉴1_서브메뉴1</div>
<div>서브메뉴2</div>
<div>서브메뉴3</div>
<div>서브메뉴4</div>
<div>서브메뉴5</div>
<div>서브메뉴6</div>
<div>서브메뉴7</div>
<div>서브메뉴8</div>
</div>
<div id="menu2sub" class="menu_level_2">
<div>메뉴2_서브메뉴1</div>
<div>서브메뉴2</div>
<div>서브메뉴3</div>
<div>서브메뉴4</div>
<div>서브메뉴5</div>
<div>서브메뉴6</div>
<div>서브메뉴7</div>
<div>서브메뉴8</div>
</div>
<div id="menu3sub" class="menu_level_2">
<div>메뉴3_서브메뉴1</div>
<div>서브메뉴2</div>
<div>서브메뉴3</div>
<div>서브메뉴4</div>
<div>서브메뉴5</div>
<div>서브메뉴6</div>
<div>서브메뉴7</div>
<div>서브메뉴8</div>
</div>
<div id="menu4sub" class="menu_level_2">
<div>메뉴4_서브메뉴1</div>
<div>서브메뉴2</div>
<div>서브메뉴3</div>
<div>서브메뉴4</div>
<div>서브메뉴5</div>
<div>서브메뉴6</div>
<div>서브메뉴7</div>
<div>서브메뉴8</div>
</div>
<div id="menu5sub" class="menu_level_2">
<div>메뉴5_서브메뉴1</div>
<div>서브메뉴2</div>
<div>서브메뉴3</div>
<div>서브메뉴4</div>
<div>서브메뉴5</div>
<div>서브메뉴6</div>
<div>서브메뉴7</div>
<div>서브메뉴8</div>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 1개

왈라스

프로필 보기 이 회원 글보기 이 회원의 댓글보기

13년 전

function menu_over(a) {

var b = a+'sub';
if(document.getElementById(a).className == 'menu_level_1') {
document.getElementById('menu1').className = 'menu_level_1';
document.getElementById('menu2').className = 'menu_level_1';
document.getElementById('menu3').className = 'menu_level_1';
document.getElementById('menu4').className = 'menu_level_1';
document.getElementById('menu5').className = 'menu_level_1';
document.getElementById(a).className = 'menu_level_1_over';

document.getElementById('menu1sub').className = 'menu_level_2';

document.getElementById('menu2sub').className = 'menu_level_2';
document.getElementById('menu3sub').className = 'menu_level_2';
document.getElementById('menu4sub').className = 'menu_level_2';
document.getElementById('menu5sub').className = 'menu_level_2';
document.getElementById(b).className = 'menu_level_2_over';

}
}
메뉴생성이 안되어 잇는 부분은 삭제 하시고...
하면 정상작동 됩니다. 원하시는 것이 이것인가요.....
class="menu_level_2" ==>1,2 관게 없음...

게시글 목록

번호	제목	글쓴이	조회	날짜
10224	JavaScript 흔한 트위터,페이스북 퍼가기 자바스크립트 1	AMDbest	6,127	13년 전
10217	Linux 리눅스 FFMPEG 자동실행소스(자작임) 6	AMDbest	4,635	13년 전
17559	인터넷 쇼핑몰, 생존 노하우는? 6	PHPㅡASP프로그래머	2,604	13년 전
10202	PHP 웹 소스 긁어오기 14	축복	4,905	13년 전
10201	PHP 쇼핑몰과 프로그램 연동작업해주실분 구해요. 메뉴얼있음	김비즈	871	13년 전
17557	구글 크롬, 젤리빈 기본브라우저로…의미는? 1	PHPㅡASP프로그래머	2,220	13년 전
10198	Mobile 스마트폰에서 영상소스는? 2	행복의길	1,932	13년 전
19955	HTML 레이아웃이 비뚤합니다. 3	바다로가자	1,606	13년 전
17556	오비고, 스마트TV용 HTML5기반 웹앱 공개	PHPㅡASP프로그래머	1,790	13년 전
10195	정규표현식 정규식으로 html 태그 지우기 2	축복	2,725	13년 전
10192	jQuery 이미지 슬라이더 만들어보았습니다. 2	현철파워	1,845	13년 전
10190	jQuery 순차애니메이션 질문좀 드리겠습니다. 1	현철파워	1,253	13년 전
10189	기타 드림위버 cs6 코딩 글깨집니다.	바다로가자	3,057	13년 전
10186	Linux CentOS release 6.3 Starting httpd: Warning: DocumentRoot [/home/myhome/public_html/] does not exist [ OK ] 뜰 때 2	카카오툴즈	3,114	13년 전
10185	PHP 접속시마다 랜덤한 페이지를 뿌려주려면	노리다	906	13년 전
10182	Linux 리눅스용 웹에디터 Kompozer 입니다. 2	하하369	3,939	13년 전
10180	PHP 에디터 홈페이지에 삽입하는 방법 1	백제	1,008	13년 전
10178	node.js node.js 0.8.2 번역 문서 1	명랑폐인	1,206	13년 전
10176	jQuery CSS3처럼 이미지 라운딩 기능의 제이쿼리 1	port	1,620	13년 전
10174	jQuery 이 플래시메뉴처럼 바꿔 만들려면... 1	가위바위보	1,559	13년 전
10173	기타 플래시 버전 좀 내려서 저장해주시겠나요-_-??	danielle	678	13년 전
10170	Mobile 가로 폭 문제 2	palangsae	834	13년 전
10168	MySQL MySQL 테이블명 대소문자 구분안하기 1	예희아빠	2,744	13년 전
10161	PHP 고수님들 도와주세요. 메일발송문제입니다. 6	미자엄마	806	13년 전
10160	Flash 플래시 네비 관련	여치당	1,361	13년 전

이전 다음

48 49 50 51 52

전체 목록