您现在的位置：中国下载站 → 学院中心 → 网页设计 → FrontPage教程 → 文章列表

使用 JavaScript 创建 FrontPage 下拉菜单

作者：佚名  来源：不详  发布时间：2007-10-20 21:16:06   

减小字体 增大字体

 
 
<table class="menu" width="155">
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 1>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 2>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 3>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 4>/a></td></tr>
          </table>
        </div>
      </td>
      <td class="menuNormal" width="160" >
        <p>Menu 4</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 1>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 2>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 3>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 4>/a></td></tr>
          </table>
        </div>
      </td>
      <td class="menuNormal" width="160" >
        <p>Menu 5</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 1>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 2>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 3>/a></td></tr>
            <tr><td class="menuNormal">>a HREF="page.asp" class="menuitem">Item 4>/a></td></tr>
          </table>
        </div>
      </td>
    </tr>
  </table>
</body>
</html>

　　列表 14. 简单下拉菜单

　　带有级联子菜单的下拉菜单的完整 HTML

　　带有级联子菜单的下拉菜单的代码如列表 15 所示。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <LINK REL="StyleSheet" HREF="menu.css">
  <script language="javascript" src="menu.js"></script>
</head>
<body>
  <h1 align="center">Main Heading</h1>
  <!-- MAIN MENU START -->
  <table class="navbar" width="800">
    <tr>
      <td class="menuNormal" width="160" >
        <p>Menu 1</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr>
              <!-- SUBMENU 1 START -->
              <td class="menuNormal" width="154" onmouseout
         ="collapse(this);">Item 1 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 1</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 2</a></td></tr>
                    <tr>
                    <!-- SUB SUBMENU START -->
                      <td class="menuNormal" width="154" >Subitem 3 ...
                        <div class="menuNormal" width="150">
                          <table class="menu" width="150">
                            <tr><td class="menuNormal"><a HREF="page.asp" class=
                  "menuitem">Subitem 1</a></td></tr>
                            <tr><td class="menuNormal"><a HREF="page.asp" class=
                  "menuitem">Subitem 2</a></td></tr>
                            <tr><td class="menuNormal"><a HREF="page.asp" class=
                  "menuitem">Subitem 3</a></td></tr>
                            <tr><td class="menuNormal"><a HREF="page.asp" class=
                  "menuitem">Subitem 4</a></td></tr>
                            <tr><td class="menuNormal"><a HREF="page.asp" class=
                  "menuitem">Subitem 5</a></td></tr>
                          </table>
                        </div>
                      </td>
                    <!-- SUB SUBMENU END -->
                    </tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 4</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 5</a></td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 1 END -->
            </tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">Item 2</a></td></tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">Item 3</a></td></tr>
            <tr>
              <!-- SUBMENU 2 START -->
              <td class="menuNormal" width="154"
            >Item 4 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 1</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 2</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 3</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 4</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 5</a></td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 2 END -->
            </tr>
          </table>
        </div>
      </td>
      <!-- MENU 1 END -->
      <!-- MENU 2 START -->
      <td class="menuNormal" width="160"
      >
        <p>Menu 2</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
            Item 1</a></td></tr>
            <tr>
              <!-- SUBMENU 3 START -->
              <td class="menuNormal" width="154"
            >Item 2 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 1</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 2</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 3</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 4</a></td></tr>
                    <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Subitem 5</a></td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 3 END -->
            </tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Item 3</a></td></tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
               Item 4</a></td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 2 END -->
      <!-- MENU 3 START -->
      <td class="menuNormal" width="160"
      >
        <p>Menu 3</p>
        <div class="menuNormal" width="155">
          <table width="155" class="menu">
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
            Item 1</a></td></tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
            Item 2</a></td></tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
            Item 3</a></td></tr>
            <tr><td class="menuNormal"><a HREF="page.asp" class="menuitem">
            Item 4</a></td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 3 END -->
      <!-- MENU 4 START -->
      <td class="menuNormal" width="160"
      >
        <p>Menu 4</p>
        <d

上一页  [1] [2] [3] [4] [5]  下一页


在百度中搜索更多使用 JavaScript 创建 FrontPage 下拉菜单相关网页 转贴于：中国下载站

  • 上一篇文章：FrontPage基础教程 表单的设计
  • 下一篇文章：立体视觉 让您的网页“靓”起来

  • 阅读统计:[]

    • 【中国下载站】【设为主页】【收藏本页】【打印本文】【回到顶部】【关闭此页】

    相关文章
    文章评论（评论内容只代表网友观点，与本站立场无关！）

    用户名： ！ 查看更多评论

    分　值：100分 85分 70分 55分 40分 25分 10分 0分

    内　容： ！

             (注“！”为必填内容。) 验证码： 验证码,看不清楚?请点击刷新验证码
     栏目导航
     分类广告
     热门文章
    设为首页 - 关于我们 - 广告服务 - 网站地图 - 加入收藏 - 网站声明 - 网站帮助 - 友情链接
    • Copyright (C) 2006-2008 www.cndownz.com All Rights Reserved.
      中国下载站 版权所有. 粤ICP备05141802号. 对本站有任何建议、意见或投诉，请来信:cndownzcom@yahoo.com.cn.
      喜欢中国下载站(cndownz.com)，请把中国下载站(cndownz.com)告诉你QQ上的5位好友，多谢支持！