Cool jQuery Slider Plugin with CSS3 Animations - Wiper
| File Size: | 1.21 MB |
|---|---|
| Views Total: | 3357 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Wiper is a cool and fancy jQuery slider plugin that rotates and collapses the slides with amazing accordion-like CSS3 transitions and transforms.
Basic Usage:
1. Load the latest jQuery library and jQuery wiper plugin on the page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="jquery.wiper.js"></script>
2. Load the required jQuery wiper's stylesheet file on the page.
<link rel="stylesheet" href="styles/jquery.wiper.css" type="text/css" />
3. Markup html structure.
<ul id="demo"> <li> <h2>Slide 1</h2> Your Content Goes Here </li> <li> <h2>Slide 2</h2> Your Content Goes Here </li> <li> <h2>Slide 3</h2> Your Content Goes Here </li> ... </ul>
4. Call the plugin.
<script>
$(function() {
$("ul#demo").Wiper();
});
</script>
5. All the default options.
<script>
$(function() {
$("ul#demo").Wiper({
easing: 'cubic-bezier(0,0,0.25,1)', // easing options. linear, ease, ease-in, ease-out, ease-in-out
duration: 1300,
offset: 1,
offsetDelay: 0,
binder: $(window),
menuColors: [ '#666699', '#660066', '#20aeb2', '#cc99cc', '#339999', '#228b22' ], // arrary of title's colors
});
});
</script>
This awesome jQuery plugin is developed by MCoLtd. For more Advanced Usages, please check the demo page or visit the official website.











