The simple production of the Pull-down menu

Menu | dropdown

For today's avid web design enthusiasts, the monotonous web page effect is far from satisfying their novelty mentality. This article is to introduce a simple pull-down menu of the production. As long as you know a little bit of HTML knowledge, you can. Even if do not understand what, divert also line, hehe.

The first step, define the Drop-down menu JS code

<script language=javascript>
!--
function Mm_findobj (n, D) {//v4.01
var p,i,x; if (!d) d=document; if ((P=n.indexof ("?")) >0&&parent.frames.length) {
D=parent.frames[n.substring (p+1)].document; N=n.substring (0,p);}
if (!) ( X=d[n]) &&d.all) x=d.all[n]; for (i=0;! x&&i<d.forms.length;i++) X=d.forms[i][n];
for (i=0;! x&&d.layers&&i<d.layers.length;i++) X=mm_findobj (n,d.layers[i].document);
if (!x && d.getElementById) X=d.getelementbyid (n); return x;
}
function MM_showHideLayers () {//v6.0
var i,p,v,obj,args=mm_showhidelayers.arguments;
For (i=0 i< (args.length-2); i+=3) if ((Obj=mm_findobj (args[i))!=null) {v=args[i+2];
if (obj.style) {Obj=obj.style v= (v==show) Visible: (v==hide) hidden:v; }
Obj.visibility=v; }
}
-->
</SCRIPT>

Step two, insert the Directory menu at the appropriate location

   
           
    bordercolorlight= #000000   width=100 bgcolor= #ccccff  height=15>
              
      href= "2#" > online bookstore  
       
     bordercolorlight= #000000  width=100 bgcolor= #ccccff  height=15>
               
       href= "Over" > book disk directory

The third step is to insert the definition of the hidden layer.

<div id=layer1 style= "Z-INDEX:1; Visibility:hidden; Position:absolute; top:42px; left:12px; width:88px; Height:163px "
>
<table bordercolor= #ffffff bgcolor= #ccccff bordercolorlight= #000000 border=1
<TBODY>
<TR>
<TD height=15>
<div align=center><a href= "a#" > latest book </A> </DIV> </TD> </TR>
<TR>
<TD height=15>
<div align=center><a href= "s#" > Hot books </A> </DIV> </TD> </TR>
<TR>
<TD height=15>
<div align=center><a href= "d#" a grand launch </A> </DIV> </TD> </TR>
</TBODY> </TABLE>
</DIV>
<div id=layer2 style= "Z-INDEX:1; Visibility:hidden; Position:absolute; top:42px; left:85px; width:120px; Height:127px "
>
<table bordercolor= #ffffff bgcolor= #ccccFF bordercolorlight= #000000 border=1
<TBODY>
<TR>
<TD height=15>
<div align=center><a
Href= "F #" The total directory </A> </DIV> </TD> </TR>
<TR>
<TD height=15>
<div align=center><a
Href= "g#" > book directory </A> </DIV> </TD> </TR>
</TBODY> </TABLE>
</DIV>

Here you can see a full drop-down menu of the web effects.