Bounce.js Bounce.js / tool / free

http://bouncejs.com

bounce.js lets you create tasty CSS3 powered animations in no time.
5 favorites
submitted over 2 years ago, by CREEATION
Bounce.js popular tool

1 Comment

pineapple

damn cool... the output it makes is pretty crazy though

.animation-target {
  -webkit-animation: animation 1000ms linear both;
  animation: animation 1000ms linear both;
}

/* Generated with Bounce.js. Edit at http://bouncejs.com/#{s:[{T:"r",e:"b",d:1000,D:0,f:0,t:90,s:3,b:4},{T:"k",e:"s",d:1000,D:0,f:{x:0,y:0},t:{x:20,y:20},s:3,b:4}]} */

@-webkit-keyframes animation { 
  0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  1.666667% { -webkit-transform: matrix3d(0.93183, 0.36771, 0, 0, -0.25498, 0.96876, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.93183, 0.36771, 0, 0, -0.25498, 0.96876, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  3.333333% { -webkit-transform: matrix3d(0.76226, 0.65419, 0, 0, -0.49915, 0.87169, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.76226, 0.65419, 0, 0, -0.49915, 0.87169, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  5% { -webkit-transform: matrix3d(0.55111, 0.84193, 0, 0, -0.69906, 0.72379, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.55111, 0.84193, 0, 0, -0.69906, 0.72379, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  6.666667% { -webkit-transform: matrix3d(0.34658, 0.94513, 0, 0, -0.84104, 0.5532, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.34658, 0.94513, 0, 0, -0.84104, 0.5532, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }

...
}

pineapple, over 2 years ago


Login or to comment.

Tutorials are any resources you learn from.

Examples: an intro to html5 screencast, a pdf about git, photoshop effects tutorials, meta-programming in ruby, lambda calculus, higher-order fixed-point combinators.

Tools are websites, apps or services used -on- your project (indirectly), to aid the process.

Examples: A color scheme generator, email marketing software, usability heat maps, css3 code generators, a downloadable png compressor.

Assets are downloadable files used -in- your projects, usually as code, textures, or images.

Examples: a jquery sticky menu, photoshop brushes, background textures, mvc frameworks, twitter bootstrap, 960 grid system.