Mega Code Archive

 
Categories / JavaScript Tutorial / Dojo Toolkit
 

Add icon to button

< html>   <head>     <link rel="StyleSheet" type="text/css" href="js/dojo/dijit/themes/tundra/tundra.css">     <script type="text/javascript">       var djConfig = {         baseScriptUri : "js/dojo/",         parseOnLoad : true       };     </script>     <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>     <script>             dojo.require("dojo.parser");             dojo.require("dijit.Toolbar");             dojo.require("dijit.form.Button");             dojo.addOnLoad(function(  ) {                 var bold = function(  ) {alert("bold");}                 var italic= function(  ) {alert("italic");}                 var underline = function(  ) {alert("underline");}                 var superscript = function(  ) {alert("superscript");}                 var subscript = function(  ) {alert("subscript");}                 dojo.query(".dijitEditorIcon").forEach(function(x) {                         if (dojo.hasClass(x, "dijitEditorIconBold"))                             dojo.connect(x.parentNode, "onclick", bold);                         else if (dojo.hasClass(x, "dijitEditorIconItalic"))                             dojo.connect(x.parentNode, "onclick", italic);                         else if (dojo.hasClass(x, "dijitEditorIconUnderline"))                             dojo.connect(x.parentNode, "onclick", underline);                         else if (dojo.hasClass(x, "dijitEditorIconSubscript"))                             dojo.connect(x.parentNode, "onclick", superscript);                         else if (dojo.hasClass(x, "dijitEditorIconSuperscript"))                             dojo.connect(x.parentNode, "onclick", subscript);                 });             });     </script>   </head>   <body class="tundra">         <div dojoType="dijit.Toolbar" style="width:300px">             <button dojoType="dijit.form.Button"                iconClass="dijitEditorIcon dijitEditorIconBold" ></button>             <button dojoType="dijit.form.Button"                iconClass="dijitEditorIcon dijitEditorIconItalic" ></button>             <button dojoType="dijit.form.Button"                iconClass="dijitEditorIcon dijitEditorIconUnderline" ></button>             <span dojoType="dijit.ToolbarSeparator"></span>             <button dojoType="dijit.form.Button"                iconClass="dijitEditorIcon dijitEditorIconSubscript"></button>             <button dojoType="dijit.form.Button"                iconClass="dijitEditorIcon dijitEditorIconSuperscript"></button>         </div>   </body> </html>