JavaScript Harlem Shake Dance: Shake page elements with CSS 3 keyframe animations

Recommend this page to a friend!
  Info   Videos   View files Files   Download Download   Reputation   Support forum   Blog    
Ratings Unique User Downloads Download Rankings
Not enough user ratingsTotal: 328 All time: 133 This week: 5Up
Version License JavaScript version Categories
harlem-shake 1.0BSD License1.0Animation
Description 

Author

This class can shake page elements using CSS 3 keyframe animations.

It can animate a given page elements using different types of shake animation styles defined using CSS 3 @keyframe definitions.

It starts animating a given first element and then several other elements after a given delay, thus the Harlem shake meme analogy.

Currently it supports several animation styles like shake, flash, bounce, tada, swing, wobble, pulse, flip and rotate.

Innovation Award
JavaScript Programming Innovation award winner
February 2013
Winner
Harlem Shake is a meme that became popular in 2013. It consists of a person dancing initially to a given rhythm. Then other people follow by also starting to dance, eventually in different ways.

This class tries to implement a similar concept by using CSS3 keyframes to initially animate a given page element and later several other page elements.

Manuel Lemos
Picture of Arturs Sosins
  Performance   Level  
Name: Arturs Sosins <contact>
Classes: 51 packages by
Country: United States United States
Age: 36
All time rank: 1
Week rank: 6 Down
Innovation award
Innovation award
Nominee: 8x

Winner: 6x

  Files folder image Files (4)  
File Role Description
Plain text file harlemshake.js Class Main class source
Plain text file harlemshake.packed.js Class Main class packed
Accessible without login Plain text file harlemshakes.css Data Definitions of animations
Accessible without login Plain text file example.html Example Example of Harlem Shake

 Version Control Unique User Downloads Download Rankings  
 0%
Total:328
This week:0
All time:133
This week:5Up