加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程 > 正文

用php完成简单的滑动菜单

发布时间:2022-03-01 23:03:19 所属栏目:编程 来源:互联网
导读:style table {font-size = 9pt} td {height = 20px} /style body span id=menus/span span id=view/span /body script for=pad event=onclick * 产生菜单的html代码串 * 入口参数为菜单默认打开的大类号 */ function menu(n) { this.ar = new Array( /** *
  <style>
  table {font-size = 9pt}
  td {height = 20px}
  </style>
  <body>
  <span id="menus"></span>
  <span id="view"></span>
  </body>
  <script for=pad event=onclick>
   * 产生菜单的html代码串
  * 入口参数为菜单默认打开的大类号
  */
  function menu(n) {
    this.ar = new Array(
    /**
     * 参数数组
     * 列1:大类
     * 列2:小类
     * 列3:标题
     */
    new Array(1,0,"大类一"),
    new Array(1,1,"小类一"),
    new Array(1,2,"小类二"),
    new Array(2,0,"大类二"),
    new Array(2,1,"小类一"),
    new Array(2,2,"小类二"),
    new Array(2,3,"小类三"),
    new Array(3,0,"大类三"),
    new Array(3,1,"小类一"),
    new Array(3,2,"小类二"),
    new Array(4,0,"大类四"),
    new Array(4,1,"小类一"),
    new Array(4,2,"小类二"),
    new Array(4,3,"小类三")
    );
    this.width =120;
    this.bgcolor = "#f0f0f0";
    this.bordercolorlight = "#c0c0c0";
    this.bordercolordark = "#FFFFFF";
    this.tr_bgcolor = "#d0d0d0";
    var s = "<table border=1 align=center width=" this.width " bgcolor=" this.bgcolor " bordercolorlight=" this.bordercolorlight " bordercolordark=" this.bordercolordark " CELLPADDING=0 CELLSPACING=0>"
    for(var i=0;i<this.ar.length;i ) { // 构造菜单的html结构,其中将大小类编号作为自定义参数,以便事件响应时使用。
      if(this.ar[i][1] == 0) {
        if(i > 0)
          s = "</table></td></tr>";
        var vk = this.ar[i][0]==n?"block":"none";
        s = "<tr id='pad' bgcolor=" this.tr_bgcolor " v1=" this.ar[i][0] " v2=" this.ar[i][1] "><td align=center>" this.ar[i][2] "</td></tr><tr style='display:" vk "'><td><table width=100%>";
      }else
        s = "<tr><td id='bar' v1=" this.ar[i][0] " v2=" this.ar[i][1] ">" this.ar[i][2] "</td></tr>";
    }
    s = "</table></td></tr></table>";
    return s;
  }
  /*** 创建菜单 ***/
  menus.innerHTML = menu(4);
  </script>
 

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读