bootstrap: skiplinks not working correctly in iOS/Safari+VoiceOver and Android/Chrome+TalkBack
Hello,
Operating system and version : Nexus 5 Android with Talkback
Browser and version (Chrome, Firefox, Safari, IE, MS Edge, Opera 15+, Android Browser) Chrome 52.0.2746.98
Reduced test cases and potential fixes using http://codepen.io/stephendesjardins/pen/EgyNrL http://s.codepen.io/stephendesjardins/debug/EgyNrL#content
As much detail as possible for what we should add and why it’s important to Bootstrap
When I use talkback on android with a skiplink :
<a href="#content" class="sr-only sr-only-focusable">Skip to main content</a>
It says : double tap to activate, and when I do just that it doesn’t go to the content div. If I remove sr-only sr-only-focusable it ends up working correctly.
Skip links does not work on this reduce test case. I think it is important to Bootstrap because the users that uses talkback on their Android Phone will not be able to skip links.
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Comments: 15 (12 by maintainers)
Links to this issue
Commits related to this issue
- Update _screen-reader.scss Small improvements that could be important: * `clip` [is deprecated](https://www.w3.org/TR/css-masking-1/#clip-property). Adding `clip-path` as progressive enhancement; th... — committed to twbs-savage/bootstrap by ffoodd 7 years ago
- Update _screen-reader.scss (#22154) * Update _screen-reader.scss Small improvements that could be important: * `clip` [is deprecated](https://www.w3.org/TR/css-masking-1/#clip-property). Adding `... — committed to twbs/bootstrap by ffoodd 7 years ago
There is a separate bug in iOS/VO concerning links to fragment identifiers - currently putting together a test case to submit to Apple…
thanks for the pointer. this is on my to-do list of things to explore, so that definitely helps narrow it down @ffoodd @PigeardSylvain
interestingly, this seems to come down to some subtly broken implementations in both iOS/Safari and Android/Chrome. i’ll need to investigate the specific cause of this…