자바스크립트 조금만 배워도 이렇게 쓸대가 많네요
<script language="javascript">
// 탭메뉴 하핫~
function over(a,b,c) {
a.style.display = 'block';
b.style.display = 'none';
c.style.display = 'none';
}
</script>
<table>
<tr>
<!-- over(a,b,c) 는 추가 sub가 가능합니다. 추가 sub의 경우 스크립트문을 수정해주시고, over(a,b,c,d,e)와 같이 사용하시면 됩니다. 현재는 3개라서 over(a,b,c)를 사용햇습니다. -->
<td onmouseover="over(a,b,c)">탭메뉴1</td>
<td onmouseover="over(b,a,c)">탭메뉴2</td>
<td onmouseover="over(c,a,b)">탭메뉴3</td>
</tr>
</table>
<table>
<tr>
<td>
<div id="a" name="a" style="display:block">
<? echo latest("basic", "notice", 5, 40); ?>
</div>
<div id="b" name="b" style="display:none">
<? echo latest("basic", "free", 5, 40); ?>
</div>
<div id="c" name="c" style="display:none">
<? echo latest("basic", "qna", 5, 40); ?>
</div></td>
</tr>
</table>
헤헷 질문게시판에 탭메뉴 구현방법알려달라길래~ 자바를 조금 응용해서 작성해서 답변해드렷어요~ http://starcom.wo.tc/job/index2.php 너무 신기한 자바!
오늘도 열공하겟습니다.~
// 탭메뉴 하핫~
function over(a,b,c) {
a.style.display = 'block';
b.style.display = 'none';
c.style.display = 'none';
}
</script>
<table>
<tr>
<!-- over(a,b,c) 는 추가 sub가 가능합니다. 추가 sub의 경우 스크립트문을 수정해주시고, over(a,b,c,d,e)와 같이 사용하시면 됩니다. 현재는 3개라서 over(a,b,c)를 사용햇습니다. -->
<td onmouseover="over(a,b,c)">탭메뉴1</td>
<td onmouseover="over(b,a,c)">탭메뉴2</td>
<td onmouseover="over(c,a,b)">탭메뉴3</td>
</tr>
</table>
<table>
<tr>
<td>
<div id="a" name="a" style="display:block">
<? echo latest("basic", "notice", 5, 40); ?>
</div>
<div id="b" name="b" style="display:none">
<? echo latest("basic", "free", 5, 40); ?>
</div>
<div id="c" name="c" style="display:none">
<? echo latest("basic", "qna", 5, 40); ?>
</div></td>
</tr>
</table>
헤헷 질문게시판에 탭메뉴 구현방법알려달라길래~ 자바를 조금 응용해서 작성해서 답변해드렷어요~ http://starcom.wo.tc/job/index2.php 너무 신기한 자바!
오늘도 열공하겟습니다.~
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
댓글 11개
function tab(tab) {
for(var i=1; i<4; i++)
document.getElementById("tab_"+i).style.display='none';
document.getElementById(tab).style.display='block';
}
</script>
<div id='tab_1' style='display:block'>
tab1
</div>
<div id='tab_2' style='display:none'>
tab2
</div>
<div id='tab_3' style='display:none'>
tab3
</div>
onmouseover = tab(1);
탭갯수가 많아질때를 대비해서 위와같이 하는게 낫지 않을까요?
근데 검색하니깐 그런게 있더라구요.
http://passone.tistory.com/327?srchid=BR1http%3A%2F%2Fpassone.tistory.com%2F327
http://starcom.wo.tc/job/index2.php
// 마우스 오버시 ~ ㅋㅋ
function over(a,b,c,aa,ab,ac) {
a.style.display = 'block';
b.style.display = 'none';
c.style.display = 'none';
aa.style.color = 'black';
ab.style.color = 'gray';
ac.style.color = 'gray';
}
</script>
<div style="width:206px">
<table width="206px" border=1 cellspacing="0" bordercolor="#CCCCCC" bordercolordark="white" bordercolorlight="#cccccc">
<tr height="25px">
<td align="center" id="aa" name="aa" onmouseover="over(a,b,c,aa,ab,ac)" style="color:gray">공지사항</td>
<td align="center" id="ab" name="ab" onmouseover="over(b,a,c,ab,aa,ac)" style="color:gray">자유게시판</td>
<td align="center" id="ac" name="ac" onmouseover="over(c,a,b,ac,aa,ab)" style="color:gray">Q&A질답</td>
</tr>
</table>
<div id="a" name="a" style="display:block">
<? echo latest("basic", "notice", 5, 40); ?>
</div>
<div id="b" name="b" style="display:none">
<? echo latest("basic", "free", 5, 40); ?>
</div>
<div id="c" name="c" style="display:none">
<? echo latest("basic", "qna", 5, 40); ?>
</div>
</div>
이 소스로 수정~ 하하
<table width="206px".......
이렇게 되었는데요..
제가 초보라서 궁금한게...
테이블태그위에 디브태그를 넣엇는데...이유가...먼가요?
아..html 좀 안다고 했는데..
역시 다시 기본부터 차근 차근..... -.-;;;;