ClassyLeaves
Socialize with the power of jQuery!
Introduction
ClassyLeaves is a plugin that will provide beautiful decorations on your website: falling and rotating interactive leaves. If you click on a leaf, it will fall; if you click on a falling leaf, magic will happen.
The plugin is crossbrowser, mobile-optimized and very easy to extend.
Download it
License
This jQuery plugin is distributed under the MIT license. Enjoy!Demo
Setup
First you need to include the jQuery library, since ClassySocial is a plugin. You can download it from the jQuery website or link it directly from the Google CDN.
You will also need the jQuery rotate plugin, which you can insert into your page with the code below:
Secondly, you need to include the jQuery ClassyLeaves javascript and the CSS file, which you can do it by adding the code below to your page.
As the last step, you create an instance of the plugin object, which you can store in a variable for later use.
var tree = new ClassyLeaves({ leaves: 30, maxY: -10, multiplyOnClick: true, multiply: 2, infinite: true, speed: 4000 });
This way, when you want to add more leaves, you can do:
tree.add(8);
Options
-
Parameters
- leaves - number of leaves to spawn initially, default is 50
- maxY - spread size, default is 100
- multiplyOnClick - whether to multiply the leaf when the user clicks on it, can be true or false, default is true
- multiply - number of images to spawn when clicking on a leaf, default is 1
- infinite - if you want the leaves to never stop falling, can be true or false, default is true
- speed - speed of the falling leaf animation, default is 3000
- numImages - total number of images in the leaves folder, default is 8
- folder - the folder containing the leaf images, default is images/leaves/