web下的UI System (转)

web下的UI System (转)[@more@]

 

大家好，我用Javascript写了一套web下的UI System，主要是树和菜单。请大家提提意见。

menu:

//ui 实现

IMAGES_PATH = "images/"

var  TopMenus  = new Array();
var  FileItems  = new Array();
var  EditItems  = new Array();
var  ToolsItems = new Array();
var  HelpItems  = new Array();

var  subMenu  = new Array();

TopMenus[0] = new TopMenu("File","文件");  // subMenu,display
TopMenus[1] = new TopMenu("Edit","编辑");
TopMenus[2] = new TopMenu("Tools","工具");
TopMenus[3] = new TopMenu("Help","帮助");

addTopMenu(TopMenus);

//File menu items
FileItems[0] = new MenuItem("images/open0.gif","新建","onFileOpen");
FileItems[1] = new MenuItem("open0.gif","打开");
FileItems[2] = new MenuItem("open0.gif","关闭");
FileItems[3] = new MenuItem("","退出","onFileExit");

//Edit menu items
EditItems[0] = new MenuItem("open0.gif","剪切");
EditItems[1] = new MenuItem("open0.gif","删除");
EditItems[2] = new MenuItem("close0.gif","复制");

//Tools menu items
ToolsItems[0] = new MenuItem("open0.gif","管理");
ToolsItems[1] = new MenuItem("open0.gif","安全");
ToolsItems[2] = new MenuItem("open0.gif","选项",null,"OptionFont");

//Help menu items
HelpItems[0] = new MenuItem("open0.gif","参照");
HelpItems[1] = new MenuItem("open0.gif","联机文档");
HelpItems[2] = new MenuItem("open0.gif","Web");

var FontItems = new Array();

FontItems[0] = new MenuItem("../images/open0.gif","宋体");
FontItems[1] = new MenuItem("../images/open0.gif","行体");
FontItems[2] = new MenuItem("../images/open0.gif","草体");

addSubMenu("File",FileItems);  //Id,MenuItems
addSubMenu("Edit",EditItems);
addSubMenu("Tools",ToolsItems);
addSubMenu("Help",HelpItems);
addSubMenu("OptionFont",FontItems);

function onFileOpen()
{
  //ToDo
}

function onFileExit()
{
  window.close();
}
document.onclick  = onClick;  // 捕获click事件
document.onmouseover = onMouseOver;  // 捕获mouseover事件
document.onmouseout  = onMouseOut;  // 捕获mouseout事件

运行效果：

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/10752043/viewspace-989635/，如需转载，请注明出处，否则将追究法律责任。

转载于:http://blog.itpub.net/10752043/viewspace-989635/