forsigner / magic-check Goto Github PK

Great work on this. When using display:none, for hiding radio and checkbox elements it breaks accessibility. When navigating form elements with keyboard elements with display:none don't receive focus.
This conversation could be used as solution for this. Also adding :focus styles would further improve the accessibility.

如果用checked 来做全选效果，before 和 after 只触发一次

Hi

I love this, so thanks for your work on it.

However, do you have a print stylesheet for this? Printing any magic checkbox or radio button fails to show if an item was checked/selected.

Thanks

如题。

When you dynamically add a checkbox or radio via the JS, the animation stops working, that is, the state does not change.
Is it plugin problems or css animation features?

show uncheck when check-box indeterminate

原生的label也存在这个问题，看来不太好解决了

Hi,

I must put CSS path ("css/magic-check.css") in main attribute of the bower.json unless bower/gruntjs will not work.

Vincent

Hello!
Thank you for really beautiful controls!
I have a problem that the elements isn't tabbable. The role attributes doesn't work for this.
I think that it's very important for Web.

This is because native checkbox element is hidden display: none;
For correct working native element doesn't need to be hidden. It's need to be invisible for good view but doesn't hidden.

For myself I apply opacity: 0; but I'm not sure that it's a good idea... You are a pro, I think you can better :)

.magic-checkbox {
  position: absolute;
  opacity: 0; }

And for visual effect of focus I added the outline

.magic-checkbox:focus + label:before {
  outline: -webkit-focus-ring-color auto 5px;
}

I hope for your fix for everyone. Thank you! All the best!