Javascript实现网页上的多级菜单（竖着）

使用方法：

1,包含menu.js和menu.css

2,用创建主菜单类

   main = new mainmenu(10,50,"my menu");

这里，mainmenu的前两个参数表示其左上角位置坐标，前者为left,后者为top。第三个参数为菜单标题。

之后用menuitem类建立菜单项

menuitem的源型如下：

   function menuitem(_parent,_caption, _url, _target,_style, _image,_templatepos,_description)其中，_parent为父菜单项，例如：

   ,"_blank",null,"detrox.gif",false,"detrox's homepage    on programming");建立了一个main的菜单项，又如

   ,"_blank",null,"detrox.gif",false,"detrox's homepage    on programming");建立一个item1的子菜单项

其他参数：

_caption为菜单项的标题，new当_caption为“-”时可显示分割线。

url为其连接目的地

_target为文档读取的位置(同a标签的target属性)

_style可以添加菜单项的特殊css属性

_image为显示在菜单文字前小图标的路径

_description为菜单注释(同a标签的title属性)。

特别说明：

_templatepos 用于和dreamweaver结合制作网页时。当需要使用template机制，而_url又需要在网页中相对定位时。设置_templatepos为true并且需要在dreamweaver的template中加入定位标签：<a id = "lnkdir" href = template所在目录相对于根目录的位置></a>。例如：

template文件：normalpage.dwt存在于站点的templates目录，这需要在normalpage.dwt中加入。

<a id="lnkdir" href="../."></a>

显示菜单：

最后使用，mainmenu的show()命令显示菜单。

例如:

main.show()

用户可以自定义菜单的显示方法。通过定义fshow(id)函数.函数原型如下

fshow(id)

这里id时将要显示的菜单（div元素）的id号。可以通过这个id号控制菜单。定义mfshow(id)可以改变主菜单的显示方法。

注释：

有子菜单的菜单项后的箭头图标文件名必须为arrow.gif文件，如果我提供的箭头颜色和您希望的不符请更改这个文件。

css样式的定义：

定义您自己的菜单样式，请修改menu.css，其中

.smenuitem 为菜单项被选中时的样式

.nmenuitem 为菜单项未被选中时的菜单样式

.mnutitle 为主菜单的标题样式

.nmenubk 为菜单背景层样式

想看源代码？点这里下载吧

<a href="http://download.csdn.net/source/726478">http://download.csdn.net/source/726478</a>