手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >下拉菜单的简易制作
下拉菜单的简易制作
摘要:对于如今热衷于网页设计的爱好者们来说,单调的网页效果已经远远不能满足他们新奇的心理了。本文就来介绍一种简单的下拉菜单的制作。只要你懂得一点点...

对于如今热衷于网页设计的爱好者们来说,单调的网页效果已经远远不能满足他们新奇的心理了。本文就来介绍一种简单的下拉菜单的制作。只要你懂得一点点HTML的知识,就可以。即使什么也不懂,照葫芦画瓢也行,呵呵。

第一步,定义下拉菜单JS代码

<SCRIPT language=JavaScript>

<>

</SCRIPT>第二步,在适当的位置插入目录菜单

<TABLE borderColor=#ffffff height=25 width=150 align=left bgColor=#cccccc border=1 >

<TBODY> <TR>

<TD

onmouseover="MM_showHideLayers(Layer2,,hide,Layer1,,show)"

borderColorLight=#000000 width=100 bgColor=#ccccff height=15>

<DIV align=center><A

onclick="MM_showHideLayers(Layer2,,hide,Layer1,,show)"

href="2#">网上书店</A></DIV></TD>

<TD

onmouseover="MM_showHideLayers(Layer2,,show,Layer1,,hide)"

borderColorLight=#000000 width=100 bgColor=#ccccff height=15>

<DIV align=center><A

onclick="MM_showHideLayers(Layer2,,show,Layer1,,hide)"

href="1#">书盘目录</A></DIV></TD>

</TR>

</TBODY>

</TABLE>第三步,插入隐藏层的定义.

<DIV id=Layer1

<TABLE borderColor=#ffffff bgColor=#ccccff borderColorLight=#000000 border=1 onmouseover="MM_showHideLayers

(Layer1,,show)" onmouseout="MM_showHideLayers(Layer1,,hide)">

<TBODY>

<TR>

<TD height=15>

<DIV align=center><A href="A#">最新图书</A></DIV></TD></TR>

<TR>

<TD height=15>

<DIV align=center><A href="S#">热点图书</A></DIV></TD></TR>

<TR>

<TD height=15>

<DIV align=center><A href="D#">隆重推出</A></DIV></TD></TR>

</TBODY></TABLE>

</DIV>

<DIV id=Layer2

<TABLE borderColor=#ffffff bgColor=#ccccFF borderColorLight=#000000 border=1 onmouseover="MM_showHideLayers

(Layer2,,show)" onmouseout="MM_showHideLayers(Layer2,,hide)">

<TBODY>

<TR>

<TD height=15>

<DIV align=center><A

href="F#">总目录</A></DIV></TD></TR>

<TR>

<TD height=15>

<DIV align=center><A

href="G#">图书目录</A></DIV></TD></TR>

</TBODY></TABLE>

</DIV>到这里,你就可以看到一个完整的下拉菜单的网页特效了。

【下拉菜单的简易制作】相关文章:

JS实现浏览器菜单命令

打字效果

一个很简单的办法实现TD的加亮效果.

会自动逐行上升的文本框

javascript实现树形菜单的方法

DIV任意拖动的问题

下拉菜单

表单的一些基本用法与技巧

无限扩展的年份select

一个很简单的办法实现TD的加亮效果.

精品推荐
分类导航