#3545 closed task (fixed)
Button icon and (text) label specification
Reported by: | bill | Owned by: | bill |
---|---|---|---|
Priority: | high | Milestone: | 0.9beta |
Component: | Dijit - Form | Version: | 0.9 |
Keywords: | Cc: | tk, [email protected]…, [email protected]… | |
Blocked By: | Blocking: |
Description (last modified by )
Button basically takes an icon and text (like swing buttons), but the icon is specified as a CSS background image, so the interface will look like this:
<button dojotype=dijit.form.Button iconClass=saveIcon> Save </button>
where the template is:
<button> <div class="buttonIcon ${iconClass}"></div> <div dojoAttachPoint=containerNode class=buttonLabel> ${label} </div> </button>
and the CSS for saveIcon displays the icon from a sprite
.saveIcon { background-image: url(...) 0 -16 ... }
For toolbar buttons, in normal mode the text won't show up, just the icon, but in high contrast mode the text will show up instead (and won't be limited to 16x16).
.toolbarButton .buttonLabel { display: none; } .dijit_a11y .toolbarButton .buttonIcon { display: none; } .dijit_a11y .toolbarButton .buttonLabel { display: inline }
Oh, also there's a title attribute on each button to tell the screen reader the text.
Maybe MenuItem? should extend Button. In any case it should support the same interface (and Tree should also do icons this way).
Change History (5)
comment:1 Changed 15 years ago by
Description: | modified (diff) |
---|
comment:2 Changed 15 years ago by
Milestone: | 0.9 → 0.9beta |
---|---|
Resolution: | → fixed |
Status: | new → closed |
comment:3 Changed 15 years ago by
Cc: | tk [email protected]… [email protected]… added |
---|---|
Resolution: | fixed |
Status: | closed → reopened |
Reopening to get input on a Dtk.org forum topic: (http://dojotoolkit.org/forum/dijit-dijit-0-9/dijit-support/dijit-form-button-change-iconclass)
Should this provide an iconNode attachpoint so users can programatically switch iconClasses for "onHover" or "onMouseDown" etc?
CC'ing the 2 users who are inquiring about this possible bug.
-Karl
comment:4 Changed 15 years ago by
Resolution: | → fixed |
---|---|
Status: | reopened → closed |
comment:5 Changed 11 years ago by
Component: | Dijit → Dijit - Form |
---|
Fixed by recent checkins to Button.js and Menu.js