1.) Drop-down Menu

Copy the following code into your Head tags <style> <!-- #slidemenubar, #slidemenubar2{ position:absolute; border:1.5px solid black; background-color:#F2F2F2; layer-background-color:#F2F2F2; font:bold 12px Verdana; line-height:20px; } --> </style>

Copy the following code into your Body tags <script language="JavaScript1.2"> var slidemenu_width='160px' var slidemenu_reveal='12px' var slidemenu_top='170px' var ns4=document.layers?1:0 var ie4=document.all var ns6=document.getElementById&&!document.all?1:0 if (ie4||ns6) document.write('<div id="slidemenubar2" style="left:'+((parseInt(slidemenu_width)-parseInt(slidemenu_reveal))*-1)+'px; top:'+slidemenu_top+'; width:'+slidemenu_width+'" onMouseover="pull()" onMouseout="draw()">') else if (ns4){ document.write('<style>\n#slidemenubar{\nwidth:'+slidemenu_width+';}\n<\/style>\n') document.write('<layer id="slidemenubar" left=0 top='+slidemenu_top+' width='+slidemenu_width+' onMouseover="pull()" onMouseout="draw()" visibility=hide>') } var sitems=new Array() //siteitems[x]=["Item Text", "Optional URL associated with text"] sitems[0]=["<big><font face='Arial'>Site Menu</font></big>", ""] sitems[1]=["Menus And Navigation", "http://www.dynamicdrive.com/dynamicindex1/"] sitems[2]=["Document Effects", "http://www.dynamicdrive.com/dynamicindex3/"] sitems[3]=["Scrollers", "http://www.dynamicdrive.com/dynamicindex2/"] sitems[4]=["Image Effects", "http://www.dynamicdrive.com/dynamicindex4/"] sitems[5]=["Links And Buttons", "http://www.dynamicdrive.com/dynamicindex5/"] sitems[6]=["Dynamic Clocks & Dates", "http://www.dynamicdrive.com/dynamicindex6/"] sitems[7]=["Text Animations", "http://www.dynamicdrive.com/dynamicindex10/"] sitems[8]=["Browser Window", "http://www.dynamicdrive.com/dynamicindex8/"] sitems[9]=["User System Information", "http://www.dynamicdrive.com/dynamicindex9/"] sitems[10]=["Other", "http://www.dynamicdrive.com/dynamicindex11/"] if (ie4||ns4||ns6){ for (i=0;i<sitems.length;i++){ if (sitems[i][1]) document.write('<a href="'+sitems[i][1]+'" target="'+target+'">') document.write(sitems[i][0]) if (sitems[i][1]) document.write('</a>') document.write('<br>\n') } } function regenerate(){ window.location.reload() } function regenerate2(){ if (ns4){ document.slidemenubar.left=((parseInt(slidemenu_width)-parseInt(slidemenu_reveal))*-1) document.slidemenubar.visibility="show" setTimeout("window.onresize=regenerate",400) } } window.onload=regenerate2 rightboundary=0 leftboundary=(parseInt(slidemenu_width)-parseInt(slidemenu_reveal))*-1 if (ie4||ns6){ document.write('</div>') themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style } else if (ns4){ document.write('</layer>') themenu=document.layers.slidemenubar } function pull(){ if (window.drawit) clearInterval(drawit) pullit=setInterval("pullengine()",10) } function draw(){ clearInterval(pullit) drawit=setInterval("drawengine()",10) } function pullengine(){ if ((ie4||ns6)&&parseInt(themenu.left)<rightboundary) themenu.left=parseInt(themenu.left)+10+"px" else if(ns4&&themenu.left<rightboundary) themenu.left+=10 else if (window.pullit){ themenu.left=0 clearInterval(pullit) } } function drawengine(){ if ((ie4||ns6)&&parseInt(themenu.left)>leftboundary) themenu.left=parseInt(themenu.left)-10+"px" else if(ns4&&themenu.left>leftboundary) themenu.left-=10 else if (window.drawit){ themenu.left=leftboundary clearInterval(drawit) } } </script>

2.) Slide In Link

Copy the following code into your Head tags <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"> ie=document.all?1:0 n=document.layers?1:0 ns6=document.getElementById&&!document.all?1:0 lshow=60 var move=10; menuSpeed=40 var moveOnScroll=true var ltop; var tim=0; function makeMenu(obj,nest){ nest=(!nest) ? '':'document.'+nest+'.' if (n) this.css=eval(nest+'document.'+obj) else if (ns6) this.css=document.getElementById(obj).style else if (ie) this.css=eval(obj+'.style') this.state=1 this.go=0 if (n) this.width=this.css.document.width else if (ns6) this.width=document.getElementById(obj).offsetWidth else if (ie) this.width=eval(obj+'.offsetWidth') this.left=b_getleft this.obj = obj + "Object"; eval(this.obj + "=this") } function b_getleft(){ if (n||ns6){ gleft=parseInt(this.css.left)} else if (ie){ gleft=eval(this.css.pixelLeft)} return gleft; } function moveMenu(){ if(!oMenu.state){ clearTimeout(tim) mIn() }else{ clearTimeout(tim) mOut() } } 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 } } 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 } } function checkScrolled(){ if(!oMenu.go) oMenu.css.top=eval(scrolled)+parseInt(ltop) if(n||ns6) setTimeout('checkScrolled()',30) } function menuInit(){ oMenu=new makeMenu('divMenu') if (n||ns6) scrolled="window.pageYOffset" else if (ie) scrolled="document.body.scrollTop" oMenu.css.left=-oMenu.width+lshow if (n||ns6) ltop=oMenu.css.top else if (ie) ltop=oMenu.css.pixelTop oMenu.css.visibility='visible' if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled(); } window.onload=menuInit; </script>

Copy the following code into your Body tags <div id="divMenu" style="position:absolute; top:250; left:30; visibility:hidden; background-color:F0F0F0"> <nobr> <a href="http://www.dynamicdrive.com">Dynamic Drive</a> - <a href="http://www.codingforums.com">Coding Forums</a> - <a href="http://active-x.com/">Active-X.com</a> - <a href="javascript://" onclick="moveMenu()" style="background-color:yellow;text-decoration:none">MENU</a> </nobr> </div>

About us | Celebrities | Fun Frill | Festivals | Magazine |  Photo Gallery | Contact us