在web开发中做界面的工具(js)[1]

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

本文简介:选择自 shift_007 的 blog

在web开发中做界面一般都是有美工做的,但是如果要做成类似windows一样的界面,就比较麻烦,前些日子我在网上找到一个免费的js,它类似与一个做控件的工具,有button,menu,toolbar等常用的控件,可以帮助web开发者画界面。它的使用很简单,如加一个按钮,<div class=tbbutton img
class=tbicon  src="bgcolor.gif" width=23> </div>,
只要指定class就可以了,最后引用这个js就可以了

下面的界面是用js做出来:

   

代码如下:toolbar.js

// copyright 1999 microsoft corporation. all rights reserved.
// author: steve isaac, microsoft corporation
//
// dhtml toolbar package
//
// this file (along with the companion toolbars.css file) implements full featured
// toolbars completely in dhtml.
//
// see tutorial.htm in the doc directory for full info on how to use this package.
//
//
//=================================================================================================
//

// public style classes
// --------------------
// tbtoolbar:    toolbar
// tbbutton:     toolbar button
// tbicon:       toolbar or menu icon
// tbseparator:  toolbar or menu separator
// tbmenu:       pulldown menu
// tbmenuitem:   menu item
// tbsubmenu:    submenu
// tbgeneral:    arbitrary html element in a toolbar.
// tbcontentelement: identifies an html element as the page body. one and only one
//               element on the page must have this class. the element must also have
//               its id set to "tbcontentelement".
//
// public attributes
// -----------------
// tbtype: special type of element. possible values are:
//   elements: toggle
//             radio
//             <not specified> - simple button
//
//   toolbars: nomouseover
//             <not specified> - mouseover supported
//
// tbstate: state of the element. possible values are:
//   elements: gray (disabled)
//             checked
//             unchecked
//            
//   toolbars: dockedtop
//             dockedbottom
//             hidden
//
// tbonmenushow: event handler that is called immediately prior to showing a menu or
//   submenu. hosts use this to set the state of menu items. this attribute can either
//   be set on individual menus and submenus, or on a toolbar in which case it is
//   fired for every menu and submenu within that toolbar. the menu that is about
//   to be shown is given in tbeventsrcelement (see below).
//
// public functions
// ----------------
// tbsetstate(element, newstate)
//   sets the state of an element.
//     element: element to set. this is an object.
//     newstate: state to set. this is a string, same values as tbstate.
//
// tbrebuildtoolbar(toolbar, rebuildmenus)
//   use this routine to change the contents of a toolbar on the fly. make all changes
//   (adding, removing and modifying toolbar elements), then call this routine once.
//  this routine can also be used to add an entirely new toolbar.
//     toolbar: toolbar to rebuild. this is an object.
//     rebuildmenus: should the menus in this toolbar also be rebuilt? only set this
//       to true if there have been changes; its an expensive operation.
//
// tbrebuildmenu(menu, rebuildsubmenus)
//   use this routine to change the contents of a menu or a submenu on the fly. make all changes
//   (adding, removing and modifying menu items), then call this routine once.
//     menu: menu to rebuild. this is an object.

本文关键:在web开发中做界面的工具(js)
 

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

go top