탭 메뉴 구성 1 (여러개의 공지사항 묶음에 효율적인 스크립트)
페이지 정보
작성자 서방님 댓글 0건 조회 159회 작성일 07-12-07 16:32본문
<script language="javascript">
<!--
function DisplayMenu(index) {
for (i=1; i<=4; i++)
if (index == i) {
thisMenu = eval("menu" + index + ".style");
thisMenu.display = "";
}
else {
otherMenu = eval("menu" + i + ".style");
otherMenu.display = "none";
}
}
-->
</script>
<div id="menu1" style="display:;">
<table border="0" cellpadding="0" cellspacing="0" width="246">
<tr align=center>
<td onclick="DisplayMenu(1)" style="cursor:hand" bgcolor=#FF0000>TAB 1</td>
<td onclick="DisplayMenu(2)" style="cursor:hand" bgcolor=efefef>TAB 2</td>
<td onclick="DisplayMenu(3)" style="cursor:hand" bgcolor=efefef>TAB 3</td>
<td onclick="DisplayMenu(4)" style="cursor:hand" bgcolor=efefef>TAB 4</td>
</tr>
<tr>
<td bgcolor=#FF0000 colspan=4>
이곳은 첫번째 탭입니다.<br>
원하는 내용을 삽입하면 됩니다.
</td>
</tr>
</table>
</div>
<div id="menu2" style="display:none;">
<table border="0" cellpadding="0" cellspacing="0" width="246">
<tr align=center>
<td onclick="DisplayMenu(1)" style="cursor:hand" bgcolor=efefef>TAB 1</td>
<td onclick="DisplayMenu(2)" style="cursor:hand" bgcolor=#33FF66>TAB 2</td>
<td onclick="DisplayMenu(3)" style="cursor:hand" bgcolor=efefef>TAB 3</td>
<td onclick="DisplayMenu(4)" style="cursor:hand" bgcolor=efefef>TAB 4</td>
</tr>
<tr>
<td bgcolor=#33FF66 colspan=4>
두번째 탭입니다.<br>
이미지 삽입도 가능합니다.<br>
<img src="http://www.blueb.co.kr/SRC/javascript/image/test.jpg width=100>
</td>
</tr>
</table>
</div>
<div id="menu3" style="display:none;">
<table border="0" cellpadding="0" cellspacing="0" width="246">
<tr align=center>
<td onclick="DisplayMenu(1)" style="cursor:hand" bgcolor=efefef>TAB 1</td>
<td onclick="DisplayMenu(2)" style="cursor:hand" bgcolor=efefef>TAB 2</td>
<td onclick="DisplayMenu(3)" style="cursor:hand" bgcolor=#0099FF>TAB 3</td>
<td onclick="DisplayMenu(4)" style="cursor:hand" bgcolor=efefef>TAB 4</td>
</tr>
<tr>
<td bgcolor=#0099FF colspan=4>
세번째 탭입니다.<br>
이미지 삽입도 가능합니다.<br>
<img src="http://www.blueb.co.kr/SRC/javascript/image/img01.jpg width=100>
</td>
</tr>
</table>
</div>
<div id="menu4" style="display:none;">
<table border="0" cellpadding="0" cellspacing="0" width="246">
<tr align=center>
<td onclick="DisplayMenu(1)" style="cursor:hand" bgcolor=efefef>TAB 1</td>
<td onclick="DisplayMenu(2)" style="cursor:hand" bgcolor=efefef>TAB 2</td>
<td onclick="DisplayMenu(3)" style="cursor:hand" bgcolor=efefef>TAB 3</td>
<td onclick="DisplayMenu(4)" style="cursor:hand" bgcolor=#FFFF66>TAB 4</td>
</tr>
<tr>
<td bgcolor=#FFFF66 colspan=4>
네번째 탭입니다.<br><br><br><br><br><br><br><br><br>
</td>
</tr>
</table>
</div>
댓글목록
등록된 댓글이 없습니다.