Opened 15 years ago

Closed 15 years ago

#3691 closed defect (fixed)

make focus of slider more visible

Reported by: Becky Gibson Owned by: Becky Gibson
Priority: high Milestone: 1.0
Component: Accessibility Version: 0.9
Keywords: slider focus Cc: owen
Blocked By: Blocking:


it is currently very difficult to determine that focus is on the slider component. We need a way to make this more visible while not relying soley on color. One possibility is to make the line inside of the slider more prominent when it has focus. We could also put a border around the slider.

The slider has a really big focus border in high contrast (which isn't ideal but acceptable).

Attachments (1)

sliderFocus.patch (2.2 KB) - added by dante 15 years ago.

Download all attachments as: .zip

Change History (9)

comment:1 Changed 15 years ago by Becky Gibson

Owner: changed from Becky Gibson to dante

The focus border in high contrast mode was modified during #3789 and/or #3790 so there is no longer a focus border in high contrast mode. Ideally would like focus on the slider handler or slider bar (around bar but not including end increase/decrease buttons - like Windows Control Panel Mouse speed adjust slider). Just need some visual means to identify that slider has focus both in "normal" and high contrast mode. Discussed at July 23, 2007 dijit meeting.

comment:2 Changed 15 years ago by bill

Milestone: 1.0

comment:3 Changed 15 years ago by dante

Status: newassigned

comment:4 Changed 15 years ago by tk

Keywords: slider focus added

fixing so searches find this a bit easier... to stop Dante from complaining so much...

comment:5 Changed 15 years ago by bill

(In [10840]) Fix CSS classes for focused/blurred state of widget. For slider and other widgets (maybe everything except TextBox??) the class was not changing upon focus. Refs #3691.

comment:6 Changed 15 years ago by dante

(In [10869]) refs #3691 - no focus visible on slider - almost fixes completely, lacks a11y high-contrast requirements in ie6/7 focus is now visible via darker border, handle and progress background image. outline for a11y in ff/safari but not working in ie.

Changed 15 years ago by dante

Attachment: sliderFocus.patch added

comment:7 Changed 15 years ago by dante

Owner: changed from dante to Becky Gibson
Status: assignednew


i attached a fix to close this ticket regarding a11y love. would you please review and merge if you find it acceptable?

briefly: 8px border + 0px inner == 16px, so 4px border (and #000 instead of #666) + 8px inner == 16px ... makes the "handle" node outlined and hollow. you can add a background color, and make it not hollow, but isn't that irrelevant in "real" high contrast?

comment:8 Changed 15 years ago by bill

Resolution: fixed
Status: newclosed

(In [11132]) Fixes #4803: fix accordion borders on IE by putting border on outer AccordionContainer? node rather than inner nodes Fixes #3691: indicate focus of slider in high contrast mode

These patches from Peter Higgins

Note: See TracTickets for help on using tickets.