Thursday, January 17th, 2008
Facebook releases Animation library
Category: JavaScript
, Library, Social Networks
Facebook is slowly adding features that allow you to do more JavaScript in their world. This started with FBJS (after mock ajax), and today they have announced FBJS/Animation, an open source animation library that not only works inside Facebook, but also can be used stand alone.
There is a nice writeup of Animation which includes tweening, easing, and checkpoints.
Some examples include:
HTML:
-
-
<!-- Simple -->
-
<a href="#" onclick="Animation(this).to('background', '#fff').from('#ffff4b').go(); return false;">Flash</a>
-
-
<!-- Hiding / shrinking -->
-
<a href="#" onclick="Animation(document.getElementById('container')).to('height', '0px').to('opacity', 0).hide().go(); return false;">Hide this div</a>.
-
-
<!-- Revealing -->
-
<a href="#" onclick="Animation(document.getElementById('about')).to('height', 'auto').from('0px').to('width', 'auto').from('0px').to('opacity', 1).from(0).blind().show().go(); return false;">About Facebook</a>.
-
-
<!-- Easing -->
-
<a href="#" onclick="Animation(document.getElementById('container')).to('height', '0px').to('width', '0px').to('opacity', 0).blind().hide().ease(Animation.ease.end).go(); return false;">Hide this div</a>.
-
It is great to see open source libraries like this come out of Facebook. I am curious why they decided not to use one of the other animation libraries out there. If you know, comment below!
2.4 rating from 30 votes
Well I took a quick look at the code and it looks to be pretty straight forward and written in a clear style. It’s good to see a high profile web presence sharing more of its resources like this.
Vive la Web!
Yuck.
But I’m sure it works fine. Is it inline only?
I’d love to know why they rolled their own library as well. Are their FB specific animation apis that abstract the usage a bit?
That’s neat that Facebook has an animation library, but really, these are horrible examples to sport from Facebook. Is this how they’re recommending people use it?
They probably just did it inline to keep the examples simple
Now I know why they call it a platform.
Jordan is right - Facebook IS a platform. They are constantly creating new APIs and updating existing ones. Now they are adding effects to the mix with this animation framework of theirs. Its great for FBML developers but I dont expect to see it out in the wild.
I think its a great idea by FB to create this - it will make the interface in FB even better. Now, where can I hide every stupid application?