Cquence: a very tiny JavaScript animation library | Hacker News Reader

Cquence: a very tiny JavaScript animation library

github.com

45 pointsPindakaasMan14 comments

Just commenting to point this out:

      if( IE8 ){ // gemene browsers
          /*
           ...
              */
      } else { // lieve browsers
          /*
           ...
              */
      }

No, it's not about browser vs. feature detection, it's just that you made me learn two new words. :) Gotta love developers' comments expressivity!

Impressive.

All this impressive animation frameworks will end up bringing flash animations back to the mainstream web.

The syntax was inspired by flash. I really like that one liners you could do in there. My company is now using this for advertisements banners and such.

Truth be told Flash is a great, I mean GREAT, platform and HTML is making strides to be more like it. It does/did everything that HTML5+ wants to do in a contained executable -- any new HTML/JS/CSS feature is already doable with Flash. Flash isn't without its warts, but that's not the point, but if you were to take a step back and evaluate it without bias, you'd be impressed with what Macromedia/Adobe did with that runtime.

Anyway, I like the idea behind this library. I like that you can compose the animation keyframes the way it does. Any suggestions that I'd make to "improve" it would probably bloat it up -- classname selectors, css-based animations/transitions. What I like most about this lib is how it does what it does in such a small package.

I guess in the Basic example, you need to put comma after the easIn and easOut function.

sequence( easIn( :id, :time, { :from }, { :to }) <-- Here easOut( :id, :time, { :from }, { :to }) <-- and Here sleep( :time ) // Wait utill time is passed )

Correct I will update the readme thanks

Why not utilize CSS more? For example how animation is done in AngularJS? I know it's supposed to be more light weight than that but at least conceptually...

The project was designed to be easily extendable. Feel feel to send a pull request for other functions the "utilize" more CSS.

CSS animations are not faster perse, but they are compatible with less browsers and any programmatic animation (where the actual animation is configured based on dynamic inputs) would only get more complicated than just keeping everything in the javascript world.

As for the CSS properties you can animate -- the code seems neutral enough to not really pick a baseline. So you have the freedom to pick your own level of browser support.

Just a nice organised starting point, and keeping the stuff that should be your code, your code.

Nice work but I'd recommend name spacing this library - you are throwing a lot of functions and variables in the global namespace.

Thanks for the tip. Its is mostly used within an iframe, since it was developed for banners and such so it wasn't an issue but will work on that thanks :)

Cool project. I like how minimalist it is.

Could you provide some templates as well, just for the lib to be ready to use in a glance?

Sure, I will include some example code for you. Check back tomorrow.

Nice!

Reply on news.ycombinator.com