Looking for WordPress plugin?
It is available here: http://codecanyon.net/item/chop-slider-2-wordpress-plugin/588927
Main Script Features
Chop Slider 2 – is the one of the greatest and the most eyecatching animated jQuery image sliders with over the 150 predefined effects, including 3D effects!
Amazing CSS3 Animation
Chop Slider uses full power of CSS3 animation (2D and 3D transform transitions), has own CSS3 2D Transforms and 3D Transforms support detection and works a little bit different (but still awesome) in old (and Internet Explorer) browsers
Chop Slider comes with Transitions Library – additional script file that contains a lot, lot, lot of predefined amazing transition effects
- 105 2D Transitions – the most common case. These 105 effects will work in all major browsers, except IE. In IE they will look a little bit different but still awesome
- 37 3D Transitions – for the modern browsers. Currently work in: Chrome (Windows Vista+, Mac OSX ), Safari (Windows XP+, Mac OSX , iOS)
- 5 “No CSS3 ” Transitions – for the browsers that do not support CSS3 Transforms like IE6 -9 (not presented on this demo page)
- 5 “Mobile” Transitions – for the mobile browsers (not presented on this demo page)
Chop Slider 3D
Chop Slider 2 supports amazing and the most eyecatching 3D Transitions with the following features:
- 4 sub-types of 3D Transition effect for full customization and flexibility: vertical3D (used in 3D Blocks), horizontal3D (used in 3D Blocks), multiFlip Vertical and multiFlip Horizontal (used in Multi Flip)
- Chop Slider allows you to enable/disable rendering of backfaces to make effect looks more reallistic
- You can even set any background (color or image) for backfaces. All 4 back faces are supported!
- It is also possible to animate (rotate, scale, move) Slider’s container in 3D dimension, but only on the time of transition. For example, this function is used in “3D Flips” 16, 17 transitions
- Amazing “Full-3D Mode”. With this option all slides will be always in 3D.
Flexible 3-Level Effects Degradation
Chop Slider comes with flexible 3-level effects degradation. It is based on features detection and with this feature Chop Slider will work in all browsers.
So the “top” effects level is the 3D Transforms, but it currently works in Webkit browsers – Chrome and Safari.
- First level of degradation. If visitor’s browser do not support 3D Transforms then Chop Slider will automatically switch the Transition to 2D Transforms – it is the most common case, and these transitions are supported by all modern browsers except Internet Explorer.
- Second level of degradation. If visitor’s browser do not support CSS3 2D Transforms then Chop Slider will switch the transition to the so called “No CSS3 ” transition effect. It is a little bit simple than previous (without rotation), but will look still awesome.
- Third level of degradation. If user will visit site from his mobile device, then Chop Slider will switch the transition effect to the most simple “Mobile” transition
The most awesome feature is that you can specify (or choose from Transitions Library) different transition for every level of degradation! If you will not specify these “degrade” transitions then Chop Slider will degrade them automatically.
Full Navigation Control
Control your slideshow as you want. Chop Slider comes with built-in control navigation, it support “Next” and “Previous” triggers and Pagination. If you do not want to use built-in navigation control you can disable it and use your own with external API
Captions With Any HTML Content
Chop Slider is ready to use with HTML captions with built-in captions control with CSS3 animation effects. And again, if you do not want to use built-in captions control you can disable it and use your own with external API
Build Your Own Transition Effects – Be Unique
Chop Slider allows you to create unlimited number of custom unique transitions and to be fully creative. Chop Slider has ultra flexible, smart and very powerful Math engine. It provides you with the following options:
- About 15 parametric options for 2D Transitions and 20 options for 3D Transitions like: xOffset, yOffset, scaleX( and Y and Z), rotate, translateX(and Y and Z), border-radius, opacity, origins, etc.
- About 5 time (duration) options, you can set the time (or delay) for every part of transition
- Almost all parametric options can be set to “random” value. So it is possible to create full-random transitions or soft-random transitions (e.g. you can set only one parameter to “random”)
- Custom carousel. You can start the transition not only from the left-top corner, but from any slice: from first, last, middle or … even from 18th(e.g.) slice!
- Delay progressions for Multi transition types (like 2D Multi and 3D Flips). Currently available “Linear” (slice by slice) and “Progressive” (diagonally) progressions
- Ability to specify totally different parameters for the "Next" and "Previous" transitions
- Support CSS3 timing functions (easing) like “linear”, “ease-in”, “ease-out”, “ease”, “ease-in-out”, even custom cubic-bezier functions
- Support CSS3 custom origins
External API for more flexibility
Comes with very useful functions and additional jQuery methods. They allow to make slider transitions a part of environment’s animation or to use your own caption or navigation control
Call Back API
Chop Slider supports custom onStart() and onEnd() callback functions. They are very useful if you want to use custom navigation or caption control
Chop Slider supports Autoplay feature with custom Autoplay-delay
Slides As Links
Chop Slider allows to use image slides as hyper-links
Easy To Setup
It is very easy to integrate Chop Slider. In minimal case all you need is to add some container with your slides-images and to add couple of CSS rules.
Chop Slider is very lightweight:
- Core Plugin – 6.5Kb minified and gzipped
- Transitions Library – 4.1Kb minified and gzipped
Chop Slider was tested and compatible with the following browsers:
- Internet Explorer v6+
- Firefox v3+
- Google Chrome v4+
- Safari v4+
- Opera v10+
Documentation and Live Demos
In the package you will find 50 pages illustrated PDF documentation and live demos with explanation
Download Chop Slider 2 jQuery Plugin (Sliders)