<style>

#divMenu {font-family:arial,helvetica; font-size:12pt; font-weight:bold}
#divMenu a{text-decoration:none;}
#divMenu a:hover{color:red;}
</style>
<script language="JavaScript1.2">
/********************************************************************************
Submitted with modifications by Jack Routledge (http://fastway.to/compute) to DynamicDrive.com
Copyright (C) 1999 Thomas Brattli @ www.bratta.com
This script is made by and copyrighted to Thomas Brattli
This may be used freely as long as this msg is intact!
This script has been featured on http://www.dynamicdrive.com
********************************************************************************
Browsercheck:*/
ie=document.all?1:0
n=document.layers?1:0

//These are the variables you have to set:

//How much of the layer do you wan't to be visible when it's in the out state?
lshow=60

//How many pixels should it move every step?
var move=10;

//At what speed (in milliseconds, lower value is more speed)
menuSpeed=40

//Do you want it to move with the page if the user scroll the page?
var moveOnScroll=true

/********************************************************************************
You should't have to change anything below this.
********************************************************************************/
//Defining variables
var tim;
var ltop;

//Object constructor
function makeMenu(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')      
 this.state=1
 this.go=0
 this.width=n?this.css.document.width:eval(obj+'.offsetWidth')
 this.left=b_getleft
    this.obj = obj + "Object";  eval(this.obj + "=this") 
}
//Get's the top position.
function b_getleft(){
 var gleft=(n) ? eval(this.css.left):eval(this.css.pixelLeft);
 return gleft;
}
/********************************************************************************
Deciding what way to move the menu (this is called onmouseover, onmouseout or onclick)
********************************************************************************/
function moveMenu(){
 if(!oMenu.state){
  clearTimeout(tim)
  mIn() 
 }else{
  clearTimeout(tim)
  mOut()
 }
}
//Menu in
function mIn(){
 if(oMenu.left()>-oMenu.width+lshow){
  oMenu.go=1
  oMenu.css.left=oMenu.left()-move
  tim=setTimeout("mIn()",menuSpeed)
 }else{
  oMenu.go=0
  oMenu.state=1
 } 
}
//Menu out
function mOut(){
 if(oMenu.left()<0){
  oMenu.go=1
  oMenu.css.left=oMenu.left()+move
  tim=setTimeout("mOut()",menuSpeed)
 }else{
  oMenu.go=0
  oMenu.state=0
 } 
}
/********************************************************************************
Checking if the page is scrolled, if it is move the menu after
********************************************************************************/
function checkScrolled(){
 if(!oMenu.go) oMenu.css.top=eval(scrolled)+ltop
 if(n) setTimeout('checkScrolled()',30)
}
/********************************************************************************
Inits the page, makes the menu object, moves it to the right place,
show it
********************************************************************************/
function menuInit(){
 oMenu=new makeMenu('divMenu')
 scrolled=n?"window.pageYOffset":"document.body.scrollTop"
 oMenu.css.left=-oMenu.width+lshow
 ltop=(n)?oMenu.css.top:oMenu.css.pixelTop;
 oMenu.css.visibility='visible'
 if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();
}

//Initing menu on pageload
onload=menuInit;
</script>
<div id="divMenu" style="position:absolute; top:30; left:20; width:200; visibility:hidden; background-color:#64D0FE">
<nobr>
<a href="http://www.bunbun000.com/">【笨笨網站】</a> -
<a href="http://www.bunbunhk.com/BBS/Discuz/index.php">【笨網論壇】</a> -
<a href="http://www.bunbunhk.com/cgi-bin/html/index.htm">【語法測試】</a> -

<a href="http://www.bunbunhk.com/bg.htm">【免費資源】</a>

<a href="javascript://" onclick="moveMenu()" style="background-color:yellow;text-decoration:none">MENU</a>
</nobr>
</div>

top:30;

選單位置高低，可更改

width:200;
選單按鈕闊度，可更改

如連結要另開新頁可將 a href 改為 a target="_blank" href