当前位置: 首页 > 图文教程 > 网络编程 > PHP > 用php实现简单的滑动菜单

PHP
PHP 开发环境的选择、建立及使用(5)
PHP 开发环境的选择、建立及使用(6)
PHP 开发环境的选择、建立及使用(7)
PHP 开发环境的选择、建立及使用(8)
PHP 开发环境的选择、建立及使用(9)
Win2003下APACHE PHP5 MYSQL4 PHPMYADMIN 的简易安装配置
PHP新手上路(八) 文件上传
PHP新手上路(九) 投票系统
PHP新手上路(十) 简易banner动态更替
PHP新手上路(十一) 数据库链接
PHP新手上路(十二)使用PHP来操作Oracle数据库
PHP新手上路(十三)PHP资源
PHP新手上路(十四) 其他杂项
session全教程(一)
session全教程(二)
session全教程(三)
PHP编码规范
第十五节--Zend引擎的发展 -- Classes and Objects in PHP5 [15]
第十四节--命名空间 -- Classes and Objects in PHP5 [14]
第十二节--类的自动加载 -- Classes and Objects in PHP5 [12]

PHP 中的 用php实现简单的滑动菜单


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 156 ::
收藏到网摘: n/a

<style>
table {font-size = 9pt}
td {height = 20px}
</style>
<body>
<span id="menus"></span>
<span id="view"></span>
</body>
<script for=pad event=onclick>
// 大类节点点击响应
for(var i=1;i<this.parentElement.rows.length;i+=2)
 this.parentElement.rows[i].style.display = "none";
this.parentElement.rows[this.rowIndex+1].style.display='block';
view.innerHTML = this.v1 +":"+ this.v2; // 根据大小类自行构造相应动作
</script>
<script for=bar event=onclick>
// 小类节点点击响应
view.innerHTML = this.v1 +":"+ this.v2; // 根据大小类自行构造相应动作
</script>
<script>
/**
* 产生菜单的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>