Javascript: Slide Menu Bar code

SUBMITTED BY: Guest

DATE: Oct. 14, 2013, 12:33 a.m.

FORMAT: JavaScript

SIZE: 3.8 kB

Raw Download

HITS: 1223

Report
  1. <html>
  2. <head>
  3. <style>
  4. <!--
  5. #slidemenubar, #slidemenubar2{
  6. position:absolute;
  7. border:1.5px solid black;
  8. background-color:#F2F2F2;
  9. layer-background-color:#F2F2F2;
  10. font:bold 12px Verdana;
  11. line-height:20px;
  12. }
  13. -->
  14. </style>
  16. </head>
  17. <body>
  18. <script language="JavaScript1.2">
  19. var slidemenu_width=160 //specify width of menu (in pixels)
  20. var slidemenu_reveal=12 //specify amount that menu should protrude initially
  21. var slidemenu_top=170 //specify vertical offset of menu on page
  23. var ns4=document.layers?1:0
  24. var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
  25. var ns6=document.getElementById&&!document.all?1:0
  27. if (ie4||ns6)
  28. document.write('<div id="slidemenubar2" style="left:'+((slidemenu_width-slidemenu_reveal)*-1)+'; top:'+slidemenu_top+'; width:'+slidemenu_width+'" onMouseover="pull()" onMouseout="draw()">')
  29. else if (ns4){
  30. document.write('<style>\n#slidemenubar{\nwidth:'+slidemenu_width+';}\n<\/style>\n')
  31. document.write('<layer id="slidemenubar" left=0 top='+slidemenu_top+' width='+slidemenu_width+' onMouseover="pull()" onMouseout="draw()" visibility=hide>')
  32. }
  34. var sitems=new Array()
  36. ///////////Edit below/////////////////////////////////
  38. //siteitems[x]=["Item Text", "Optional URL associated with text"]
  40. sitems[0]=["<big><font face='Arial'>Site Menu</font></big>", ""]
  41. sitems[1]=["Menus And Navigation", "/"]
  42. sitems[2]=["Document Effects", "/"]
  43. sitems[3]=["Scrollers", "/"]
  44. sitems[4]=["Image Effects", "/"]
  45. sitems[5]=["Links And Buttons", "/"]
  46. sitems[6]=["Dynamic Clocks & Dates", "/"]
  47. sitems[7]=["Text Animations", "/"]
  48. sitems[8]=["Browser Window", "/"]
  49. sitems[9]=["User System Information", "/"]
  50. sitems[10]=["Other", "/"]
  52. //If you want the links to load in another frame/window, specify name of target (ie: target="_new")
  53. var target=""
  55. /////////////////////////////////////////////////////////
  57. if (ie4||ns4||ns6){
  58. for (i=0;i<sitems.length;i++){
  59. if (sitems[i][1])
  60. document.write('<a href="'+sitems[i][1]+'" target="'+target+'">')
  61. document.write(sitems[i][0])
  62. if (sitems[i][1])
  63. document.write('</a>')
  64. document.write('<br>\n')
  65. }
  66. }
  68. function regenerate(){
  69. window.location.reload()
  70. }
  71. function regenerate2(){
  72. if (ns4){
  73. document.slidemenubar.left=((slidemenu_width-slidemenu_reveal)*-1)
  74. document.slidemenubar.visibility="show"
  75. setTimeout("window.onresize=regenerate",400)
  76. }
  77. }
  78. window.onload=regenerate2
  79. rightboundary=0
  80. leftboundary=(slidemenu_width-slidemenu_reveal)*-1
  81. if (ie4||ns6){
  82. document.write('</div>')
  83. themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style
  84. }
  85. else if (ns4){
  86. document.write('</layer>')
  87. themenu=document.layers.slidemenubar
  88. }
  90. function pull(){
  91. if (window.drawit)
  92. clearInterval(drawit)
  93. pullit=setInterval("pullengine()",10)
  94. }
  95. function draw(){
  96. clearInterval(pullit)
  97. drawit=setInterval("drawengine()",10)
  98. }
  99. function pullengine(){
  100. if ((ie4||ns6)&&parseInt(themenu.left)<rightboundary)
  101. themenu.left=parseInt(themenu.left)+10
  102. else if(ns4&&themenu.left<rightboundary)
  103. themenu.left+=10
  104. else if (window.pullit){
  105. themenu.left=0
  106. clearInterval(pullit)
  107. }
  108. }
  110. function drawengine(){
  111. if ((ie4||ns6)&&parseInt(themenu.left)>leftboundary)
  112. themenu.left=parseInt(themenu.left)-10
  113. else if(ns4&&themenu.left>leftboundary)
  114. themenu.left-=10
  115. else if (window.drawit){
  116. themenu.left=leftboundary
  117. clearInterval(drawit)
  118. }
  119. }
  120. </script>
  121. </body>
  122. </html>
comments powered by Disqus