dhtmlxToolbar is a completely customizable JavaScript toolbar. It allows you to create an attractive vertical or horizontal DHTML Toolbar within minutes. dhtmlxToolbar can load its content from XML so it can be easily changed without reloading. It has cross-browser/multiplatform compatibility, powerful client-side API, and customizable icons (with JavaScript or XML). dhtmlxToolbar supports several buttons types (image, image with text, and select).

Supported Browsers:

  • IE 5.x and above
  • Mac OS X Safari
  • Mozilla 1.4 and above
  • FireFox 0.9 and above
  • Opera (XML support depends on browser version)
  • Toolbar Features:

  • Multibrowser/Multiplatform support
  • Full controll with JavaScript API
  • Dynamic loading
  • XML support
  • horizontal and vertical layout
  • different types of buttons
  • customizable design
  • high stability
  • Licensing

  • Free License
  • Download Toolbar:

  • Full package
  • Documentation only
  • Examples:

  • Initialize object
  • Add/Delete items
  • Customisable layout
  • Vertical layout
  • Skinable design
  • Button properties
  • Documentation:

  • API Functions and Documentation

  • Download Toolbar source code

    Code Sample

    <link rel="STYLESHEET" type="text/css" href="css/dhtmlXTree.css"> <script language="JavaScript" src="js/dhtmlXProtobar.js"></script> <script language="JavaScript" src="js/dhtmlXToolbar.js"></script> <script language="JavaScript" src="js/dhtmlXCommon.js"></script> <script> var tree1 = null; function onButtonClick(itemId,itemValue) { alert("Button "+itemId+" was pressed"); }; function doOnLoad(){ aToolBar=new dhtmlXToolbarObject("toolbar_zone",'100%',20,""); aToolBar.setOnClickHandler(onButtonClick); aToolBar.loadXML("_toolbar.xml") aToolBar.showBar(); } </script> <body onload="doOnLoad()"> <div id="toolbar_zone" style="width:600;border :1px solid Silver;"> </div>