<script type="text/javascript">
<!--
// tab
function initTabMenu(tabContainerID) {
var tabContainer = document.getElementById(tabContainerID);
var tabAnchor = tabContainer.getElementsByTagName("a");
var i = 0;
for(i=0; i<tabAnchor.length; i++) {
if (tabAnchor.item(i).className == "tab")
thismenu = tabAnchor.item(i);
else
continue;
thismenu.container = tabContainer;
thismenu.targetEl = document.getElementById(tabAnchor.item(i).href.split("#")[1]);
thismenu.targetEl.style.display = "none";
thismenu.imgEl = thismenu.getElementsByTagName("img").item(0);
thismenu.onclick = function tabMenuClick() {
currentmenu = this.container.current;
if (currentmenu == this)
return false;
if (currentmenu) {
currentmenu.targetEl.style.display = "none";
if (currentmenu.imgEl) {
currentmenu.imgEl.src = currentmenu.imgEl.src.replace("_on.gif", ".gif");
}
else {
currentmenu.className = currentmenu.className.replace(" on", "");
}
}
this.targetEl.style.display = "";
if (this.imgEl) {
this.imgEl.src = this.imgEl.src.replace(".gif", "_on.gif");
}
else {
this.className += " on";
}
this.container.current = this;
return false;
};
if (!thismenu.container.first)
thismenu.container.first = thismenu;
}
if (tabContainer.first)
tabContainer.first.onclick();
}
//-->
</script>
<table id="news_tab" border='1' bordercolor='#DFDFDF' style='border-collapse:collapse' cellpadding='5' cellspacing='0'>
<tr bgcolor='#F4F4F4'>
<td><a href="#news1" class="tab">tab menu1</a></td>
<td><a href="#news2" class="tab">tab menu2</a></td>
<td><a href="#news3" class="tab">tab menu3</a></td>
<td><a href="#news4" class="tab">tab menu4</a></td>
<td><a href="#news5" class="tab">tab menu5</a></td>
<td><a href="#news6" class="tab">tab menu6</a></td>
<td><a href="#news7" class="tab">tab menu7</a></td>
<td><a href="#news8" class="tab">tab menu8</a></td>
<td><a href="#news9" class="tab">tab menu9</a></td>
<td><a href="#news20" class="tab">tab menu20</a></td>
<td><a href="#news21" class="tab">tab menu21</a></td>
<td><a href="#news22" class="tab">tab menu22</a></td>
</tr>
<tr>
<td colspan='12'>
<table id="news1"><tr><td>tab menu1 contents1</td></tr></table>
<table id="news2"><tr><td>tab menu2 contents2</td></tr></table>
<table id="news3"><tr><td>tab menu3 contents3</td></tr></table>
<table id="news4"><tr><td>tab menu4 contents4</td></tr></table>
<table id="news5"><tr><td>tab menu5 contents5</td></tr></table>
<table id="news6"><tr><td>tab menu6 contents6</td></tr></table>
<table id="news7"><tr><td>tab menu7 contents7</td></tr></table>
<table id="news8"><tr><td>tab menu8 contents8</td></tr></table>
<table id="news9"><tr><td>tab menu9 contents9</td></tr></table>
<table id="news20"><tr><td>tab menu20 contents20</td></tr></table>
<table id="news21"><tr><td>tab menu21 contents21</td></tr></table>
<table id="news22"><tr><td>tab menu22 contents22</td></tr></table>
</td>
</tr>
</table>
<script type="text/javascript">
initTabMenu("news_tab");
</script>
<!--
// tab
function initTabMenu(tabContainerID) {
var tabContainer = document.getElementById(tabContainerID);
var tabAnchor = tabContainer.getElementsByTagName("a");
var i = 0;
for(i=0; i<tabAnchor.length; i++) {
if (tabAnchor.item(i).className == "tab")
thismenu = tabAnchor.item(i);
else
continue;
thismenu.container = tabContainer;
thismenu.targetEl = document.getElementById(tabAnchor.item(i).href.split("#")[1]);
thismenu.targetEl.style.display = "none";
thismenu.imgEl = thismenu.getElementsByTagName("img").item(0);
thismenu.onclick = function tabMenuClick() {
currentmenu = this.container.current;
if (currentmenu == this)
return false;
if (currentmenu) {
currentmenu.targetEl.style.display = "none";
if (currentmenu.imgEl) {
currentmenu.imgEl.src = currentmenu.imgEl.src.replace("_on.gif", ".gif");
}
else {
currentmenu.className = currentmenu.className.replace(" on", "");
}
}
this.targetEl.style.display = "";
if (this.imgEl) {
this.imgEl.src = this.imgEl.src.replace(".gif", "_on.gif");
}
else {
this.className += " on";
}
this.container.current = this;
return false;
};
if (!thismenu.container.first)
thismenu.container.first = thismenu;
}
if (tabContainer.first)
tabContainer.first.onclick();
}
//-->
</script>
<table id="news_tab" border='1' bordercolor='#DFDFDF' style='border-collapse:collapse' cellpadding='5' cellspacing='0'>
<tr bgcolor='#F4F4F4'>
<td><a href="#news1" class="tab">tab menu1</a></td>
<td><a href="#news2" class="tab">tab menu2</a></td>
<td><a href="#news3" class="tab">tab menu3</a></td>
<td><a href="#news4" class="tab">tab menu4</a></td>
<td><a href="#news5" class="tab">tab menu5</a></td>
<td><a href="#news6" class="tab">tab menu6</a></td>
<td><a href="#news7" class="tab">tab menu7</a></td>
<td><a href="#news8" class="tab">tab menu8</a></td>
<td><a href="#news9" class="tab">tab menu9</a></td>
<td><a href="#news20" class="tab">tab menu20</a></td>
<td><a href="#news21" class="tab">tab menu21</a></td>
<td><a href="#news22" class="tab">tab menu22</a></td>
</tr>
<tr>
<td colspan='12'>
<table id="news1"><tr><td>tab menu1 contents1</td></tr></table>
<table id="news2"><tr><td>tab menu2 contents2</td></tr></table>
<table id="news3"><tr><td>tab menu3 contents3</td></tr></table>
<table id="news4"><tr><td>tab menu4 contents4</td></tr></table>
<table id="news5"><tr><td>tab menu5 contents5</td></tr></table>
<table id="news6"><tr><td>tab menu6 contents6</td></tr></table>
<table id="news7"><tr><td>tab menu7 contents7</td></tr></table>
<table id="news8"><tr><td>tab menu8 contents8</td></tr></table>
<table id="news9"><tr><td>tab menu9 contents9</td></tr></table>
<table id="news20"><tr><td>tab menu20 contents20</td></tr></table>
<table id="news21"><tr><td>tab menu21 contents21</td></tr></table>
<table id="news22"><tr><td>tab menu22 contents22</td></tr></table>
</td>
</tr>
</table>
<script type="text/javascript">
initTabMenu("news_tab");
</script>
'web standard > script' 카테고리의 다른 글
오늘하루 창닫기 소스 (0) | 2011.06.27 |
---|---|
레이어팝업(오늘하루창닫기) 소스 (1) | 2011.06.16 |
클릭시 특정id의 class변경 (0) | 2011.01.06 |
라디오버튼체크시 레이블스타일변경 스크립트 (0) | 2010.11.17 |
ie6에서 png처리방법 (2) | 2010.05.13 |