dhtmlxToolbar:

链接 Samples：http://www.dhtmlx.com/docs/products/docsExplorer/samples.shtml

链接 Docs：http://docs.dhtmlx.com/doku.php

dhxToolbar初始化：

//init from  xml
toolbar = new dhtmlXToolbarObject("toolbarObj");
toolbar.setIconsPath("../common/imgs/");
toolbar.loadXML("../common/dhxtoolbar.xml?etc=" + new Date().getTime());
		
//init from js	
var toolbar = new dhtmlXToolbarObject("toolbarObj");
toolbar.setIconsPath("../common/imgs/");
var newOpts = Array(Array('new_text', 'obj', 'Text Document', 'text_document.gif'), Array('new_excel', 'obj', 'Stylesheet', 'stylesheet.gif'), Array('new_db', 'obj', 'Database', 'database.gif'), Array('new_pp', 'obj', 'Presentation', 'presentation.gif'), Array('new_s1', 'sep'), Array('new_other', 'obj', 'Other', 'other.gif'));
toolbar.addButtonSelect("new", 0, "New", newOpts, "new.gif", "new_dis.gif");  //下拉按钮
toolbar.addSeparator("sep1", 1);//分割线
toolbar.addButton("open", 2, "", "open.gif", "open_dis.gif");//带图片按钮
toolbar.addButton("save", 3, "", "save.gif", "save_dis.gif");
toolbar.addButton("save_as", 4, "Save As...", "save_as.gif", "save_as_dis.gif");
toolbar.disableItem("save_as");//不可用按钮, toolbar.enableItem(id);
toolbar.addSeparator("sep2", 5);
toolbar.addButton("undo", 6, "", "undo.gif", "undo_dis.gif");
toolbar.addButton("redo", 7, "", "redo.gif", "redo_dis.gif");
toolbar.addSeparator("sep3", 8);
toolbar.addButton("cut", 9, "Cut", "cut.gif", "cut_dis.gif");
toolbar.addButton("copy", 10, "Copy", "copy.gif", "copy_dis.gif");
toolbar.addButton("paste", 11, "Paste", "paste.gif", "paste_dis.gif");
toolbar.addSeparator("sep4", 12);
var printOpts = Array(Array('print_page', 'obj', 'Page', 'page.gif'), Array('print_range', 'obj', 'Page Range', 'page_range.gif'), Array('print_sel', 'obj', 'Selection', 'selection.gif'), Array('print_sep1', 'sep'), Array('print_cfg', 'obj', 'Settings', 'settings.gif'));
toolbar.addButtonSelect("print", 13, "Print", printOpts, "print.gif", "print_dis.gif");
toolbar.addSeparator("sep5", 14);
toolbar.addText("info", 15, "dhtmlxToolbar Demo");	//文本

dhxToolbar事件处理：

toolbar.attachEvent("onClick", function(id) {
	switch(id){
		case "a":
			//...
			break;
		case "b":
			//...
			break;
		case "c":
			//...
			break;	
	}
});

toolbar.setAlign('left');
toolbar.setAlign('right');
dhxToolbar.setIconSize(a);	

其他：

Attached to Layout
Attached to Layout Cell
Attached to Window
Attached to Accordion
Attached to Tabbar