Opened 13 years ago
Closed 13 years ago
#6637 closed task (fixed)
TabContainer: background image not aligned on hover
Reported by: | bill | Owned by: | bill |
---|---|---|---|
Priority: | high | Milestone: | 1.2 |
Component: | Dijit - LnF | Version: | 1.1.0 |
Keywords: | ibm | Cc: | |
Blocked By: | Blocking: |
Description
The tab container does have a rollover state but the background image doesn't align on hover state which is the problem. This is caused by defining a different position for the background image on hover.
This is the hover state that is currently being used.
.tundra .dijitTabCloseButtonHover { color: #243C5F; border-top-color:#92a0b3; border-left-color:#92a0b3; border-right-color:#92a0b3; background:#e2e2e2 url(images/tabHover.png) repeat-x bottom; }
You can see the shadow and highlights don't align on hover . If you remove the "bottom" alignment from the hover class you get the desired result.
.tundra .dijitTabCloseButtonHover { color: #243C5F; border-top-color:#92a0b3; border-left-color:#92a0b3; border-right-color:#92a0b3; background:#e2e2e2 url(images/tabHover.png) repeat-x; }
Shadows and highlights are aligned on hover:
Taken from IBM Design Leadership recommendations.
Attachments (2)
Change History (3)
Changed 13 years ago by
Changed 13 years ago by
Attachment: | current.gif added |
---|
comment:1 Changed 13 years ago by
Resolution: | → fixed |
---|---|
Status: | new → closed |
Note: See
TracTickets for help on using
tickets.
(In [13448]) Don't change gradient so much on hover. Fixes #6637.