자바스크립트 탭 질문드립니다. 채택완료
<table width="700" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="30" background="<?php echo G5_IMAGES_URL ?>/notice-bg.gif" valign="top"> <script type="text/javascript"> function main_tab(arr_no) { var tab = new Array("menu01","menu02","menu03","menu04"); var div = new Array("menu_div01","menu_div02","menu_div03","menu_div04"); var more = new Array("javascript:menu_03_01();","javascript:menu_03_02();","javascript:menu_03_04();","javascript:menu_03_05();"); var num = new Array(1,2,3,4); for(i=0;i<num.length;i++) { document.getElementById(div[i]).style.display="none"; document.getElementById(tab[i]).src='<?php echo G5_IMAGES_URL ?>/c1_'+num[i]+'off.jpg'; } document.getElementById(div[arr_no]).style.display=""; document.getElementById(tab[arr_no]).src='<?php echo G5_IMAGES_URL ?>/c1_'+num[arr_no]+'on.jpg'; document.getElementById("menu_more").href=more[arr_no]; } </script> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="120"><a href="javascript:main_tab(0);"><img src="<?php echo G5_IMAGES_URL ?>/c1_1on.jpg" name="menu01" width="120" height="42" border="0" id="menu01" /></a></td> <td width="119"><a href="javascript:main_tab(1);"><img src="<?php echo G5_IMAGES_URL ?>/c1_2off.jpg" name="menu02" width="119" height="42" border="0" id="menu02" /></a></td> <td width="119"><a href="javascript:main_tab(2);"><img src="<?php echo G5_IMAGES_URL ?>/c1_3off.jpg" name="menu03" width="119" height="42" border="0" id="menu03" /></a></td> <td width="119"><a href="javascript:main_tab(3);"><img src="<?php echo G5_IMAGES_URL ?>/c1_4off.jpg" name="menu04" width="119" height="42" border="0" id="menu04" /></a></td> <td align="right"> <!--<a href="javascript:menu_05_01();" id="menu_more"><img src="<?php echo G5_IMAGES_URL ?>/notice-more.gif" width="38" height="12" border="0" /></a>--></td> </tr> </table></td> </tr> <tr valign="top"> <td style="padding-top:30px;"> <div id="menu_div01"><?php include_once(G5_HTML_PATH.'/info1.html'); ?></div> <div id="menu_div02" style="display:none;" ><?php include_once(G5_HTML_PATH.'/info2.html'); ?></div> <div id="menu_div03" style="display:none;" ><?php include_once(G5_HTML_PATH.'/info3.html'); ?></div> <div id="menu_div04" style="display:none;" ><?php include_once(G5_HTML_PATH.'/info4.html'); ?></div> </td> </tr></table>
서브페이지에서 위와 같은 자바탭메뉴로 한페이지 내에서 페이지를 변경 가능하게 해 놓았는데요
문제가 메인 인덱스화면에서 서브페이지의 두번째 include파일로 링크를 잡아서 나오게 해야하는데
서브페이지로 실제로 접속하면 젤처음 include파일이 출력이 됩니다.
링크를 잡으려고 해도 어느탭을 누르던지 html/info.html 이런식으로 다 똑같이 나와서 잡을 수가 없네요.
혹시 자바스크립트 탭메뉴 링크 잡는 방법이 있나요?
답변 3개
http://benalman.com/code/projects/jquery-bbq/examples/fragment-advanced/#bbq1=chicken.html
샘플 예제
location.hash="tab"+arr_no ;
뭐 이런식으로 hash 값을 변경해주시고
페이지 로딩시 처음
위 hash tab 값이 있으면 해당 탭을 show 해주는 방식으로 구현하시면되세요
예제 사이트 보시면, 이해되실것같습니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
http://linebt.co.kr/bbs/board.php?bo_table=business1
링크주소입니다.
메인인덱스에서 초등학교, 중학교, 고등학교, 대학교, 교육청 이라는 버튼을 만들어서
클릭시에 서브페이지에서 클릭한 버튼의 해당 페이지가 보여지게 하고싶은데
주소가 다 똑같이 나와서 링크를 못잡고 있어요..
답변에 대한 댓글 1개
주소값이 안바뀌신다는 말씀이시죠 ? refresh 해도 활성화된 탭을 보여주고싶으시다는?
그러시면 hash 값을 이용하셔야되세요
댓글을 작성하려면 로그인이 필요합니다.
무슨 말씀인지 모르겟네용... 탭기능은 정상적으로 작동하는데 ,
해당 탭 컨텐츠내용이 다 동일하게 나온다는 말씀인가요 ?
사이트링크 고고고 올려줘 보세요 봐드릴게용
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
그냥 소스 붙여넣고 쓰는 정도라 봐도 잘은 모르지만
한번 도전해 볼게요. 감사합니다.