add "focus" to focused btns with button plugin #13907
Conversation
| e.preventDefault() | ||
| }) | ||
| $(document) | ||
| .on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) { |
There was a problem hiding this comment.
Why is/was it ^= as opposed to =?
There was a problem hiding this comment.
Because of button groups, they toggle via data-toggle="buttons".
|
I guess we can't do much at this time about the disability to focus radio inputs, right? |
|
@hnrch02 huh? don't follow sorry? |
|
This needs the styles for |
|
@hnrch02 I'll add the styles if necessary once the JS works across the board. That jsbin you linked to still wasn't working for me. I do see a focus state now though, just not on all those radio buttons. |
|
@mdo Yeah, that's what I was trying to explain. Only the first radio button can be targeted by tabbing: http://jsbin.com/cubiy/1 Anything else that didn't work for you? |
|
@hnrch02 in your demo: http://jsbin.com/fikul/5/edit when you tab to the radio, you just use your keyboard left, right, etc.… |
|
i believe that is expected for radio inputs, accessibility, etc. but i could be mistaken |
|
Oh wow, I see, wasn't aware of that. I guess then it's good to go 😄 |
|
@mdo - does it work for you if you use arrows… just want to confirm before mergin |
|
Ohhhhhh snap. 👍 |
|
@hnrch02 What other styles do we need added?
|
|
@mdo Styles for the |
|
As far as I can tell they are receiving focus styles. |
add "focus" to focused btns with button plugin
|
@mdo Well, then I must be doing something wrong: Checkbox 1 has the |
|
@hnrch02 I see focus styles in Chrome, Firefox, and Safari on OS X. You on Windows? |
|
@hnrch02 Nope, Chrome 36.0.1985.103 beta on OS X 10.9.4. Also not seeing them in Firefox 30. Safari. |
|
Damn beta software. I wonder if Chrome is changing how it handles focus? I see what I posted in my screenshot without issue. |
|
@mdo Just to be clear, you tab to |
|
|
|
@mdo Would you mind opening the CSS tab in that Bin? It includes a modified version of the |
|
Lol. |
Follow up to #13907: Add .focus styles for buttons
Follow-up to #13907: simplify JS logic for focus shim
* 'master' of https://github.com/krissihall/bootstrap: (210 commits) grunt dist Use HTTPS in CDN URLs in _config.yml Tabs to spaces speed up js tests a bit Follow-up to twbs#13907: simplify JS logic for focus shim regenerate docs/assets/js/docs.min.js popover dismiss-on-next-click example: instead of <button>, use <a> w/ tabindex Fix jsbin link Another new js bin link add docs note about browsers w/ JS disabled; fixes twbs#14134 fix twbs#14114 mo' betta Fix inaccessible buttons. typos Redundant thanks to bb1286a grunt Fixes twbs#14074: Make open dropdown nav links in navbar use gradients Fixes twbs#14133 Fixes twbs#14132: add .alert-dismissible to docs examples Use bootstrapcdn links New Android select example ...
possible solution for #12145.
bit tired tho so might have missed something…
similar to @hnrch02 – except uses focus/blur instead of focusin/focusout. I was going to use the latter, but read firefox doesn't support them (https://developer.mozilla.org/en-US/docs/Web/Events/focusout)… and this appears to work, even though i thought they didn't bubble 👀 weird.
went back and forth with toggle class, but ultimately thought it might be safer to tie specific events to specific actions