按鈕特效 - 語法區

資源小村 » 語法區 » 按鈕特效

跳出式動態選單
<html> <head> <title></title> </head> <body> 將語法放在這裡 </body> </html>	使用說明及教學複製以下原始碼到網頁 <BODY></BODY> 之間 <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[i].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>

跳出式動態選單

<html>

<head>

<title></title>

</head>

<body>

將語法放在這裡

</body>

</html>

使用說明及教學

複製以下原始碼到網頁 <BODY></BODY> 之間

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[i].hideIt()
		}
	}
	!oSub[num].vis()?oSub[num].hideIt():oSub[num].showIt();

}

onload=menuBarInit;
</script>

可以修改原始碼的內容 ( 修改以下紅色的部分，原始碼中所有以下的部份要修改 )

論壇登入

熱門投票

資源小村 » 語法區 » 按鈕特效

名稱
密碼