The best bit about this is that the HTML markup has not been changed for the visual effects. Well Done!
CSS Animated Slide Toggle
21–26 of 26 posts
Re: CSS Animated Slide Toggle
#22What about adding the ability to drag the slider, so that the widget acts as it should act, that is to say as other sliding toggles? It would then be perfect! Rationale : that's again the problem of half-baked UI elements, which confuse their end-users, while the developpers feel satisfied and enjoy long drinks.
Re: CSS Animated Slide Toggle
#23On mobile devices, there is about a 1 to 1.5 second delay before the animation begins. touchstart and js might be a better solution...
Re: CSS Animated Slide Toggle
#24Looks nice. But I think the [x] or [ ] of a normal checkbox are more intuitive than two different colors that may have different meanings in other cultures/countries (and I am not even starting about color blindness).
I agree. I think it would go a long way to have the visible side display a red X or a green checkmark, rather than an ambiguous background.
Re: CSS Animated Slide Toggle
#25You'd probably have a better framerate if you used translate or translate3d instead of a simple transition. Framerate is fine in Chrome but isn't fantastic on iPhone/iPad
Re: CSS Animated Slide Toggle
#26I get a little tired of seeing people override their web form elements this way because they should only be used for gestural interfaces, and even then it can be annoying. Trying to translate it to web just causes confusion for the user -- they don't know whether to click on it (in which case it is too wide and bulky for many circumstances) or slide it (which is unnatural for the web outside of range sliders).