设为首页  
联系我们  
加入收藏  
网页制作 冲浪宝典 图形图像 操作系统 软件教学 编程开发 认证考试 安全技术 站长专区 文学驿站 娱乐天地 游戏天地 办公软件
文章搜索
您的位置: 首页 >> 文章首页 >> 网页制作 >> DHTML >> DIV下拉式菜单(二)
精品推荐
DHTML点击TOP10
·DIV下拉式菜单(二)
·加快 DHTML 的一组技巧
·让你的网页活跃起来
·用DHTML制作带链接的滚动公告栏
·用CSS代码轻松Diy你的网页滚动条
·巧妙的幻灯片秀
·DHTML的初步入门
·会移动的文字(Marquee)
·DIV下拉式菜单(一)
·在你的主页中为Web Robot设计路标
网页制作点击TOP10
·菜鸟架设动网论坛全教程
·网页模板的使用方法 (教程)
·网页对联广告代码效果大全
·初学者入门:如何学习网页制作?
·用JavaScript实现文件图片滚动效果
·常用CSS大全
·网页自动转向代码
·图片循环滚动完美解决
·JS表格排序新法
·DIV CSS网页布局实例解析:实现表格形式
精选专题

DIV下拉式菜单(二)

作者: 来源:http://www.xgdown.com/ 时间:2006-9-19 22:30:34

    你可以把这段程序放在<head></head>标识之间,或是网页的任意位置。
  接下来,我们还要定义我们的实际菜单项了,这里我们要给每一个菜单项加上一个鼠标的移动事件(OnMouseOver)句柄,并且让这个事件调用我们上面定义的Show函数。也就是说,当鼠标一进入我们的菜单项中,我们的show函数就开始执行了。这里,我们还要给我们的每个菜单项定义一个ID号,并且把其下拉菜单列的ID名传入Show函数中,这对我们控制下拉菜单列很关键,下面我给出了菜单项的HTML语法描述:
<table border=0>
  <tr>
   <td ID="d1" onmouseover="show(this,ds1);" class="menu">杂志技术站点</td>
   <td ID="d2" onmouseover="show(this,ds2);" class="menu">门户站点</td>
   <td ID="d3" onmouseover="show(this,ds3);" class="menu">个人收藏站点</td>
  </tr>
</table>
  最后,我们要定义我们的下拉菜单列了。每一个下拉菜单列,我们都要赋予其Submenu的CSS技巧">CSS属性,和一个ID名字好让我们的Show函数控制它,最后,我们让他的默认显示方式为none,也就是让它不显示。这是给它的Display样式赋值“none”来实现的。下面,我给出了下拉菜单列的HTML语法描述:
<DIV ID="ds1" CLASS="submenu" STYLE="display:none">
  <BR><A HREF="http:\\www.yesky.com">天极网 Yesky.com</A>
  <BR><A HREF="http:\\www.cbinews.com">电脑商情报</A>
  <BR><A HREF="http:\\www.newsoft.com.cn">新潮电子</A>
  <BR> 
</DIV> 
<DIV ID="ds2" CLASS="submenu" STYLE="display:none">
  <BR><A HREF="http:\\www.sina.com.cn">新浪网 Sina</A>
  <BR><A HREF="http:\\www.sohu.com.cn">搜狐 Sohu</A>
  <BR><A HREF="http:\\www.163.com">网易 Netease</A>
  <BR> 
</DIV>
<DIV ID="ds3" CLASS="submenu" STYLE="display:none">
  <BR><A HREF="http:\\haoel.yeah.net">耗子网络编程站</A>
  <BR><A HREF="http:\\www.5460.net">中国同学录</A>
  <BR><A HREF="http:\\www.csdn.net">中国软件开发网</A>
  <BR> 
</DIV>
  这就是全部的过程了,有了以上四个步骤,你一定可以看见一个菜单了,把它放在你的网页上吧,一定会很漂亮的。当然,你也可以自己试着改变一下菜单的属性,让它更像一个菜单。 


DIV下拉式菜单(二) 相关文章:
DIV下拉式菜单(二) 相关软件:
特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
转载请注明来源:http://www.xgdown.com