다중 옵션 전환 탐색 menu_javascript 기술을 구현하는 js 메소드

이 글의 예시에서는 js에서 다중 옵션 전환 탐색 메뉴를 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 구현 방법은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

다중 옵션 전환 탐색 메뉴 #dNavBar{ 배경색:#ffffff; } #dNavBar 리{ 목록 스타일 유형:없음; 부동:왼쪽; 너비:84px; 높이:28px; 줄 높이:28px; 글꼴 크기:12px; 색상:#FFFFFF; 테두리:1px 단색 #ffffff; 배경:#86C2FF; 텍스트 정렬:가운데; 디스플레이:블록; 커서:포인터; } #하위메뉴{ 배경:#99cc66; 너비:500px; 테두리 왼쪽:1px 단색 #ffffff; 테두리 오른쪽:1px 단색 #ffffff; 높이:29px; 줄 높이:29px; 색상:#FFFFFF; 글꼴 크기:12px; 왼쪽 패딩:10px; } 몸 { 여백: 0px; } a:링크,a:방문함 { 색상: #FFFFFF; 텍스트 장식: 없음; } a:호버{ 색상: #FFFFFF; 텍스트 장식: 없음; } 기능 ShowMenu() { var barCTT=document.getElementByIdx_x("dNavBar") var liArr=barCTT.getElementsByTagName_r("li") var link=new Array() link[0]=" 현재 위치: 집" link[1]=" 항목 1> | link[2]=" 항목 1 | 항목 2 | 프로젝트 3" links[3]=" 항목 1> | | 프로젝트 4 | 프로젝트 5 " link[4]=" 프로젝트 1 | 프로젝트 2 " links[5]=" 항목 1> | " link[6]=" 프로젝트 1 | 프로젝트 2 " link[7]=" 프로젝트 1 | 프로젝트 2 " link[8]=" 프로젝트 1 | 프로젝트 2 " link[9]=" 프로젝트 1 | 프로젝트 2 " links[10]=" 프로젝트 1 | 프로젝트 2 " link[11]=" 프로젝트 1 | 프로젝트 2 " link[12]=" 프로젝트 1 | 프로젝트 2 " (i=0;i { liArr[i].onclick=function() { selectThis(this,liArr,links) } } } 함수 selectThis(indexObj,allLi,infoArr) { var 인덱스=0; (i=0;i { allLi[i].style.border="1px 솔리드 #ffffff"; allLi[i].style.BackgroundColor="#86C2FF"; allLi[i].style.height="28px"; if (indexObj==allLi[i]) { 인덱스=i; } } indexObj.style.borderBottom="0px 솔리드 #666688"; indexObj.style.BackgroundColor="#99cc66"; indexObj.style.height="31px"; document.getElementByIdx_x("subMenu").innerHTML=infoArr[index]; } 홈페이지 Entertainment Express 뮤직 월드&lt ;/li&gt ; 궁극의 플래시 사이트 공지