Radiobox.css: Animated Option Choice720kb has created a small collection of CSS animations that are supposed to free radio buttons of all the boredom. There are 12 variants available in total. The effect is triggered when the respective radio button is clicked. Depending on the effect, the button will then start bouncing, rotating, growing, and so on. [caption id="attachment_77991" align="alignnone" width="640"] Radiobox.css is a Collection of 12 Small Stylesheets for Radio Button Application. (Screenshot: Dr. Web)[/caption] Just try it. Radiobox.css provides interesting effects for one of these buttons that get ignored design-wise most of the time. Radiobox.css works with CSS3 and requires a modern browser to function. Getting it to work is very easy. Just assign the class to your radio button that represents the desired effect, for example:
<input type="radio" class="radiobox-boing"/>Radiobox.css comes, like the previously presented Granim.js, under the MIT license, and can thus be used commercially as well. Download it via Github.
Very cool, but it appears to have very thick lines moving across the gradient when animated hmm
Interesting tool. Thanks for samples and description, worth to try.
Interesting article. This easy to use Granim is as cool as it can be. Limitations are there but useful to build quick animated logos or GIF type things. For my application I have tried it in place of after effects which I am usually comfortable with.
Thanks for giving another alternative for CSS based tool.
Great share, I really enjoyed the examples for the gradient. No issues on my end when I tested. Although I personally have less of a use for radio buttons, still a very cool example of java-less animation. Thank you for sharing!