跳 出 式 動 態 選 單
<script language="JavaScript1.2">
ie=document.all?1:0
n=document.layers?1:0
var moveOnScroll=true
var hideAll=true
function makeMenuBar(obj,nest,vis){
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
this.hideIt=b_hideIt; this.showIt=b_showIt; this.vis=b_vis
if(ie && vis) this.css.visibility='hidden'
this.state=1
this.go=0
this.height=n?this.css.document.height:eval(obj+'.offsetHeight')
this.top=b_gettop
this.obj = obj + "Object"; eval(this.obj + "=this")
}
function b_gettop(){
var gleft=(n) ? eval(this.css.top):eval(this.css.pixelTop);
return gleft;
}
function b_showIt(){
this.css.visibility="visible"
}
function b_hideIt(){
this.css.visibility="hidden"
}
function b_vis(){
if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;
}
function checkScrolled(){
if(!oMenu.go)oMenu.css.top=(!oMenu.state)?eval(scrolled):eval(scrolled)
if(n) setTimeout('checkScrolled()',30)
}
function menuBarInit(){
oSub=new Array()
oSub[0]=new makeMenuBar('divSub0','divBg',1)
oSub[1]=new makeMenuBar('divSub1','divBg',1)
oSub[2]=new makeMenuBar('divSub2','divBg',1)
oSub[3]=new makeMenuBar('divSub3','divBg',1)
oSub[4]=new makeMenuBar('divSub4','divBg',1)
oSub[5]=new makeMenuBar('divSub5','divBg',1)
oMenu=new makeMenuBar('divBg')
scrolled=n?"window.pageYOffset":"document.body.scrollTop"
oMenu.css.top=eval(scrolled)
oMenu.css.visibility='visible'
if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();
}
function extract(num){
if(hideAll){
for(i=0;i<oSub.length;i++){
if(num!=i) oSub.hideIt()
}
}
!oSub[num].vis()?oSub[num].hideIt():oSub[num].showIt();
}
onload=menuBarInit;
</script>
<div id="divBg" style="width: 497; height: 232">
<table width="439" border="0" cellspacing="0" cellpadding="5" align="CENTER" valign="MIDDLE">
<tr bgcolor="#C0C0C0">
<td height="30" width="73"><a href="#" onclick="extract(0); return false">選單一</a></td>
<td width="73"><a href="#" onclick="extract(1); return false">選單二</a></td>
<td width="73"><a href="#" onclick="extract(2); return false">選單三</a></td>
<td width="73"><a href="#" onclick="extract(3); return false">選單四</a></td>
<td width="73"><a href="#" onclick="extract(4); return false">選單五</a></td>
<td width="74"><a href="#" onclick="extract(5); return false">選單六</a></td>
</tr>
<tr>
<td valign="TOP" width="73">
<div id="divSub0" class="clSub">
<a href="#">選項1-1</a> <br>
<a href="#">選項1-2</a><br>
<a href="#">選項1-3</a><br>
</div>
</td>
<td valign="TOP" width="73">
<div id="divSub1" class="clSub"> <a href="#">選項2-1</a> <br>
<a href="#">選項2-2</a><br>
<a href="#">選項2-3</a> </div>
</td>
<td valign="TOP" width="73">
<div id="divSub2" class="clSub"> <a href="#">選項3-1</a> <br>
<a href="#">選項3-2</a><a href="#">選項3-3</a> </div>
</td>
<td valign="TOP" width="73">
<div id="divSub3" class="clSub"> <a href="#">選項4-1</a> <br>
<a href="#">選項4-2</a><br>
<a href="#">選項4-3</a><br>
</div>
</td>
<td valign="TOP" width="73">
<div id="divSub4" class="clSub"> <a href="#">選項5-1</a> <br>
<a href="#">選項5-2</a><br>
<a href="#">選項5-3</a><br>
</div>
</td>
<td valign="TOP" width="74">
<div id="divSub5" class="clSub"> <a href="#">選項6-1</a> <br>
<a href="#">選項6-2</a><br>
<a href="#">選項6-3</a><br>
</div>
</td>
</tr>
</table>
</div>
修 改 原 始 碼 的 內 容 ( 修改以下紅色的部分,原始碼中所有以下的部份要修改 )
<a href="#" onclick="extract(0); return false">選單</a></td>
|