webmenu编程精彩历程之(一)结构总览和所有原代码[1]

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 kimyoo 的 blog

菜单的效果见我的相册里面的作品截屏。
menutest.htm 实际应用测试页面
menudata.xml 菜单配置页面
menu.css 菜单样式表
webmenu.htc 封装后的htc菜单组件

原代码:
====================================
menutest.htm

<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">

<title>新建网页 1</title>
<link rel="stylesheet" type="text/css" href="menu.css">
</head>

<body topmargin="0" leftmargin="0" oncontextmenu="menu1.showmenu(window,menu1.datasource.documentelement.selectsinglenode('//menuitem'),window.document.body,event.x,event.y)">
<div id="menubardiv"></div>
<webmenu datasource="xmldata" class="webmenu" id="menu1" width="100" effect="2" menutype="1" container="menubardiv"></webmenu>
<webmenu datasource="xmldata" class="webmenu" id="menu2" width="100" effect="3" menutype="0" container="menubardiv"></webmenu>
<textarea rows="17" id="code" cols="73" style="display:none"></textarea><xml id="xmldata" src="menudata.xml"></xml>
</body>

</html>
=========================================
menudata.xml
<?xml version="1.0" encoding="gb2312"?>
<root>
<menuitem  hassub="1" subwidth="160" >
      <menuitem func=""   text="一级菜单项1"  img="save.gif"/>
      <menuitem func=""   text="一级菜单项2"  img="addnew.gif" hassub="1" headcolumn="2" subwidth="200">
      <menuitem func=""  ischeckitem="1"  checked="1"  text="二级级菜单项3" img=""/> 
      <menuitem func=""  ischeckitem="1"  checked="1" text="二级级菜单项3" img=""/>
   <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img="addnew.gif"/>
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
   <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
      <menuitem func=""  ischeckitem="1"  checked="1" text="二级级菜单项3" img="save.gif"/> 
    <menuitem func=""  ischeckitem="1"  checked="1" text="二级级菜单项3" img=""/>
    <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
   <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/>
      <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
    <menuitem func=""  ischeckitem="1"  text="二级级菜单项3" img=""/> 
   </menuitem> 
      <menuitem func=""  text="一级菜单项3" img="refresh.gif" hasline="1"/>
      <menuitem func=""  text="一级菜单项4" img=""/> 
      <menuitem func=""  text="一级菜单项5" img="" hassub="1" subwidth="160">
   <menuitem func=""    text="二级级菜单项3"  img="edit.gif" hasline="1"/>
      <menuitem func=""    text="二级级菜单项3"  img=""/> 
      <menuitem func=""    text="二级级菜单项3"  img="" hassub="1" subwidth="160">
         <menuitem func=""    text="三级级菜单项4"  img="sendemail.gif" hasline="1"/>
    <menuitem func=""    text="三级级菜单项4"  img=""/> 
    <menuitem func=""    text="三级级菜单项4"  img=""/>
   </menuitem>
      </menuitem>
      <menuitem func=""  text="一级菜单项6" img="search.gif"/>
</menuitem>
</root>
===========================================
menu.css

.webmenu{
    behavior: url("webmenu.htc")
}

.menupanel
{
 border: 1px solid #002d96;

本文关键:webmenu编程精彩历程之(一)结构总览和所有原代码
  相关方案
Google
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top