
Animatable: One property, two values, endless possiblities - Dekku
http://leaverou.github.io/animatable/
======
jwarren
I highly recommend front-end developers keep up to date with Lea Verou's blog
and talks. She's a great ambassador for standards-based development and
maintains a great sense of whimsy.

I really recommend her recent talk on border-radius, for example:
[http://vimeo.com/67567648](http://vimeo.com/67567648)

~~~
da02
Thanks for the recommendation and video link.

I had no idea who Verou was. I'm so behind.

------
augustl
The demo works in Firefox, not just Chrome. What is this, some kind of
standard that works across many different implementations? ;)

Too often do demos for showing off the web work well only in Chrome. This one
works fine in Fireox, the animations are very smooth. I'm on a very basic Arch
Linux setup I installed a couple of days ago, with no configs in any way other
than installing the correct driver for my on-chip Intel GPU. So if it works
for me, it should work for most people.

~~~
icesoldier
Even better, most of the demos work fine in IE10! It's like everyone is
converging on some kind of central specification on how web pages can
animate...

------
RyanZAG
This is actually a really good learning tool for showing people what different
html/css properties do by visually showing the ranges and effects they give.

------
edwinvdgraaf
Source can be found on:
[https://github.com/leaverou/animatable/](https://github.com/leaverou/animatable/)

------
rjbwork
This is really cool! I'm in my first job where I'm having to touch some front
end things, and this is definitely going to come in handy in learning how
various style elements work and interact with one another. Who knows, maybe
I'll end up using this library in some stuff!

------
sequoia
#19 shows an interesting bug (I believe a bug) in outline styles: the z-index
of the outline is above all previous elements but below all elements that
follow (chrome). I hope this is fixed cuz I'd like to use outline.

Another awesome demo from Lea Verou!!

------
carrollgt91
All of the border-width examples act somewhat strangely on Chrome and Firefox
both.

Otherwise, this is great. I love these demos as they really give you an
intuitive sense of how CSS works.

------
innguest
Why is everyone fawning over something we all here could easily make in Flash?

This problem was solved 10 years ago, people. Let it be a reminder that we've
regressed.

~~~
usingpond
I refuse to believe you earnestly do not understand why people have ditched
Flash for most animation on the web today.

------
usingpond
Is this a script that does something, or just a demo for what most frontend
developers already do on a daily basis?

------
chuckd1356
#35 gives me a seizure if my mouse isn't perfectly still while hovering.

------
ars
#15 is broken - sort of. It works, but breaks the page layout.

~~~
keerthiko
Not for me in Chrome.

~~~
sp332
Even in Chrome, 22 pushes 24 right off the end of the line which means
everything after that randomly jumps around.

------
AmitRele
works excellent in Chrome

