탭형태로 보여주는 코드인데 일정시간이후 탭이 변경되도록 하려합니다. 정보
탭형태로 보여주는 코드인데 일정시간이후 탭이 변경되도록 하려합니다.본문
아래와 같은 탭으로 보여주는 소스가 있습니다.
현재는 클릭을 해야 해당 레이어가 보여지는데 이것을 일정시간 간격으로 다음 레이어를 보여줄 수 있나요? 도움 부탁드립니다.
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
$my_table = 'main_'; //게시판 명
$no = 12;
?>
<SCRIPT type=text/javascript>
<!--
function showreview(value){
for(i=0;i<12;i++){
if(value==i){
document.getElementById("review"+i).style.display="";
document.getElementById("tab"+i).style.display="none";
document.getElementById("tab#"+i).style.display="";
}else{
document.getElementById("review"+i).style.display="none";
document.getElementById("tab"+i).style.display="";
document.getElementById("tab#"+i).style.display="none";
}
}
}
//-->
</SCRIPT>
<table width="930" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="890"><?=latest('latest_review_tab',$my_table,$no);?></td>
<td width="40">
<!-- 탭메뉴 리스트부분 -->
<table width="40" height="300" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="25" id="tab0" style="DISPLAY: none;"><A href="javascript:showreview('0')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img01.png" border="0"></a></td><td height="25" id="tab#0"><img src="<?=$g4[path]?>/img/main/tab_img01_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab1"><A href="javascript:showreview('1')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img02.png" border="0"></a></td><td height="25" id="tab#1" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img02_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab2"><A href="javascript:showreview('2')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img03.png" border="0"></a></td><td height="25" id="tab#2" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img03_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab3"><A href="javascript:showreview('3')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img04.png" border="0"></a></td><td height="25" id="tab#3" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img04_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab4"><A href="javascript:showreview('4')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img05.png" border="0"></a></td><td height="25" id="tab#4" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img05_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab5"><A href="javascript:showreview('5')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img06.png" border="0"></a></td><td height="25" id="tab#5" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img06_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab6"><A href="javascript:showreview('6')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img07.png" border="0"></a></td><td height="25" id="tab#6" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img07_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab7"><A href="javascript:showreview('7')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img08.png" border="0"></a></td><td height="25" id="tab#7" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img08_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab8"><A href="javascript:showreview('8')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img09.png" border="0"></a></td><td height="25" id="tab#8" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img09_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab9"><A href="javascript:showreview('9')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img10.png" border="0"></a></td><td height="25" id="tab#9" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img10_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab10"><A href="javascript:showreview('10')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img11.png" border="0"></a></td><td height="25" id="tab#10" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img11_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab11"><A href="javascript:showreview('11')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img12.png" border="0"></a></td><td height="25" id="tab#11" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img12_on.png" border="0"></td>
</tr>
</table>
<!-- 탭메뉴 리스트부분 끝-->
</td>
</tr>
</table>
현재는 클릭을 해야 해당 레이어가 보여지는데 이것을 일정시간 간격으로 다음 레이어를 보여줄 수 있나요? 도움 부탁드립니다.
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
$my_table = 'main_'; //게시판 명
$no = 12;
?>
<SCRIPT type=text/javascript>
<!--
function showreview(value){
for(i=0;i<12;i++){
if(value==i){
document.getElementById("review"+i).style.display="";
document.getElementById("tab"+i).style.display="none";
document.getElementById("tab#"+i).style.display="";
}else{
document.getElementById("review"+i).style.display="none";
document.getElementById("tab"+i).style.display="";
document.getElementById("tab#"+i).style.display="none";
}
}
}
//-->
</SCRIPT>
<table width="930" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="890"><?=latest('latest_review_tab',$my_table,$no);?></td>
<td width="40">
<!-- 탭메뉴 리스트부분 -->
<table width="40" height="300" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="25" id="tab0" style="DISPLAY: none;"><A href="javascript:showreview('0')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img01.png" border="0"></a></td><td height="25" id="tab#0"><img src="<?=$g4[path]?>/img/main/tab_img01_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab1"><A href="javascript:showreview('1')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img02.png" border="0"></a></td><td height="25" id="tab#1" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img02_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab2"><A href="javascript:showreview('2')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img03.png" border="0"></a></td><td height="25" id="tab#2" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img03_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab3"><A href="javascript:showreview('3')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img04.png" border="0"></a></td><td height="25" id="tab#3" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img04_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab4"><A href="javascript:showreview('4')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img05.png" border="0"></a></td><td height="25" id="tab#4" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img05_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab5"><A href="javascript:showreview('5')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img06.png" border="0"></a></td><td height="25" id="tab#5" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img06_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab6"><A href="javascript:showreview('6')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img07.png" border="0"></a></td><td height="25" id="tab#6" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img07_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab7"><A href="javascript:showreview('7')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img08.png" border="0"></a></td><td height="25" id="tab#7" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img08_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab8"><A href="javascript:showreview('8')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img09.png" border="0"></a></td><td height="25" id="tab#8" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img09_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab9"><A href="javascript:showreview('9')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img10.png" border="0"></a></td><td height="25" id="tab#9" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img10_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab10"><A href="javascript:showreview('10')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img11.png" border="0"></a></td><td height="25" id="tab#10" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img11_on.png" border="0"></td>
</tr>
<tr>
<td height="25" id="tab11"><A href="javascript:showreview('11')" onfocus='this.blur()'><img src="<?=$g4[path]?>/img/main/tab_img12.png" border="0"></a></td><td height="25" id="tab#11" style="DISPLAY: none;"><img src="<?=$g4[path]?>/img/main/tab_img12_on.png" border="0"></td>
</tr>
</table>
<!-- 탭메뉴 리스트부분 끝-->
</td>
</tr>
</table>
댓글 전체
이걸 그냥 마우스 오버 했을때 탭이 바뀌게는 못하나요?