📄 toolbar.html

📁 用于一医院的电子病历系统. JAVA开发。很有参考价值。
💻 HTML
字号:
<html xmlns="http://www.w3.org/1999/xhtml">  <head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title>DynarchMenu: creating a toolbar</title>    <link id="theme-skin-modern" rel="stylesheet" href="../src/skin-modern.css" title="Modern" />    <link id="theme-skin-win98" rel="alternate stylesheet" href="../src/skin-win98.css" title="Win98" />    <link id="theme-skin-win2k" rel="alternate stylesheet" href="../src/skin-win2k.css" title="Win2k" />    <link id="theme-skin-xp" rel="alternate stylesheet" href="../src/skin-xp.css" title="WinXP" />    <link id="theme-skin-xp-apps" rel="alternate stylesheet" href="../src/skin-xp-apps.css" title="WinXP-apps" />    <link id="theme-skin-aqua" rel="alternate stylesheet" href="../src/skin-aqua.css" title="Aqua" />    <style type="text/css">      @import url("../code.css");      body { background-color: #cdf; margin: 10px 100px; }      .font-size td.label { text-align: center; }      .fonts .big td.label { font-size: 18px; text-align: center; }      div.dynarch-popup-menu.justify tr.item.hover td.icon,      div.dynarch-popup-menu.justify tr.item.active td.icon { background-color: #68e; }      div.dynarch-horiz-menu { border: 1px solid #000; }      .color-red { background-color: red; }      .color-cyan { background-color: cyan; }      .color-white { background-color: white; }      .color-yellow { background-color: yellow; }      .color-green { background-color: green; }      .color-blue { background-color: blue; }      .background img { border: 1px solid #888; }    </style>    <script type="text/javascript">      _dynarch_menu_url = "../src/";      var menu;      function my_dynarchmenu_handler(action) {	      var li = action.params;	      var style = document.getElementById("content").style;	      if (/^FONT-SIZE\/(.*)/.test(li.title)) {		      var font_size_item = menu.items["font-size"];		      font_size_item.setLabel(RegExp.$1);		      style.fontSize = RegExp.$1;	      } else if (/^FONT\/(.*)/.test(li.title)) {		      var font_item = menu.items["fonts"];		      font_item.setLabel(action.info.label);		      style.fontFamily = RegExp.$1;	      } else if (/^JUSTIFY\/(.*)/.test(li.title)) {		      var justify_item = menu.items["justify"];		      justify_item.icon.src = action.info.icon.src;		      style.textAlign = RegExp.$1;	      } else if (/^FORMAT\/(.*)/.test(li.title)) {		      var value = RegExp.$1;		      action.info.setPressed();		      if (value == "bold") {			      style.fontWeight = action.info.pressed ? "bold" : "normal";		      } else if (value == "italic") {			      style.fontStyle = action.info.pressed ? "italic" : "normal";		      } else if (value == "underline") {			      style.textDecoration = action.info.pressed ? "underline" : "none";			      menu.items["strike"].setPressed(false);		      } else if (value == "strike") {			      style.textDecoration = action.info.pressed ? "line-through" : "none";			      menu.items["underline"].setPressed(false);		      }	      } else if (/^BG\/(.*)/.test(li.title)) {		      var color = RegExp.$1;                      if (color != "none")			      style.backgroundColor = color;		      else			      style.backgroundColor = "";		      var icon = menu.items["background"].icon;                      icon.className = "color-" + color;              } else {		      alert(li.title);	      }      };      function toggleJustify(action) {	      var item = menu.items["justify"];	      item.display();	      action.info.icon.src = item.visible ? "../icons/checkbox-1.gif" : "../icons/checkbox-0.gif";              return true;      };      function togglePaste(action) {	      var item = menu.items["paste"];	      item.disable(!item.disabled);	      action.info.icon.src = item.disabled ? "../icons/checkbox-0.gif" : "../icons/checkbox-1.gif";              return true;      };      function toggleTooltips(action) {	      var item = action.info;	      var menu = item.menu;	      menu.config.tooltips =! menu.config.tooltips;	      item.icon.src = menu.config.tooltips ? "../icons/checkbox-1.gif" : "../icons/checkbox-0.gif";              return true;      };      function selectSkin(action) {	      var item = action.info;	      var a = ["modern", "xp", "xp-apps", "win2k", "win98", "aqua"], l;	      for (var i = 0; i < a.length; ++i) {		      l = document.getElementById("theme-skin-" + a[i]);		      if (l)			      l.disabled = true;	      }	      l = document.getElementById("theme-" + item.id);	      if (l) {		      l.disabled = false;		      menu.items["skin"].setLabel("Skin: " + l.title);	      }      };    </script>    <script type="text/javascript" src="../src/hmenu.js"></script>  </head>  <body onload="menu = DynarchMenu.setup('menu', { toolbar: true });">    <p style="text-align: center; font: bold 12px verdana; color: #d00;">      <a href="http://www.dynarch.com/products/dhtml-menu/buy.html">        DynarchMenu</a> -- Now you can also create complex Toolbars!    </p>    <ul id="menu" onclick="my_dynarchmenu_handler(this)">      <li onclick="selectSkin(this)" id="skin">        Skin: Modern        <ul>          <li id="skin-modern">Mozilla Modern</li>          <li id="skin-win2k">Windows 2000</li>          <li id="skin-win98">Windows 98</li>          <li id="skin-aqua">Aqua</li>          <li id="skin-xp">Windows XP</li>          <li id="skin-xp-apps">Windows XP apps</li>        </ul>      </li>      <li></li>      <li title="Main menu ;-)">        <img src="../icons/save.gif" alt="" />        <ul>          <li title="Overwrite existing document">Overwrite existing document</li>          <li title="Save as a new file">Save as a new file...</li>          <li></li>          <li>            <img src="../icons/checkbox-0.gif" alt="" />            <a href="javascript:retval=toggleTooltips(this)" title="Toggle menu tooltips">Show tooltips</a>          </li>          <li>            <img src="../icons/checkbox-1.gif" alt="" />            <a href="javascript:retval=toggleJustify(this)" title="Hide/show the justify menu">Display 鈥渏ustify鈥
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -