Advertising jQuery mOover
slide1
slide2
slide3
slide4
slide1
slide2
slide3
slide4

First Slide Caption

You can put any HTML content inside of captions

It could be a link to some page like this one: iDangero.us

Chop Slider supports 2 default caption animation: with CSS3 animation or simple fade in/out effect like on this demo. You can disable built-in captions control and use your own with external API

Custom Pagination inside of caption

If you do not need to use captions you can switch it off.

Chop Slider Transitions Library

Chop Slider comes with 192 predefined and ready to use transition effects - Transitions Library:

  • 122 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
  • 60 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)

To preview transition effect first of all click on the Transitions group (Horizontal, Vertical, ...) on the menu above, click on the transition's number to activate it, and then navigate through slides using left and right arrows, and pagination buttons.

Please note that some of these transitions come with a little bit different parameters for the "Previous" animation, so don't forget to check it too.

Latest Versions and Updates

- jQuery Chop Slider (core plugin) - v2.2.0 - updated on Deceber 1, 2011  Change Log

jQuery Chop Slider, Version 2.2.0

Released on December 1, 2011

  • Support for content slides with Video and HTML (only in PRO/Extended versions)
  • New amazing and unique 3D Sphere transitions (only in PRO/Extended versions)
  • New ability to set slice thickness for 3D Flips
  • New simple 2D Slide transitions
  • Added support of 3D transitions for future releases of FF, IE10 and Opera
  • New "horizontal" and "vertical" piece-delays
  • Fixed small bugs
  • Updated documentation
  • New demos in the downloaded package

jQuery Chop Slider, Version 2.0.5

Released on September 27, 2011

  • Fixed bug with a "jumping" Slider effect in the beginning of transition
  • New "hidePagination" parameter allows automatically hide/show Slider's pagination in the beginning/end of transition
  • Added ability to use more than one Chop Slider on one page
  • Multiple Chop Slider - two (or more) Sliders can be controlled by one mutual navigation (arrows and pagination)
  • Fixed minor bugs
  • Updated documentation
  • New and missed demos in the downloaded package

jQuery Chop Slider, Version 2.0.0

Initial release of version 2. Released on September 1, 2011

- Chop Slider 2 Wordpress Plugin - v1.2 - updated on December 4, 2011  Change Log, Learn more

Chop Slider 2 Wordpress Plugin, Version 1.2

Released on December 4, 2011

  • New 2D Slide and 3D Sphere transitions
  • Support for content slides with any HTML inside - WYSIWYG editor for each slide
  • Totally 50 new effects
  • New settings tab on the Chop Slider dashboard page will make future updates as simple as possible
  • Core script updated to version 2.2.0
  • Fixed minor bugs
  • Updated documentation

Chop Slider 2 Wordpress Plugin, Version 1.1

Released on October 1, 2011

  • Now you can copy (duplicate) created Sliders
  • Added "Bulk Actions", now you can easily copy (duplicate) or delete few Sliders
  • Fixed mismatch in the effects ordering on Transitions Library and "Creation" pages
  • Added "noCSS3" and "Mobile" transitions to the Transitions Library page
  • Fixed minor bugs
  • Updated documentation

Chop Slider 2 Wordpress Plugin, Version 1.0

Initial release. Released on September 27, 2011

- Transitions Library - v1.2 - updated on December 1, 2011 Change Log

Transitions Library, Version 1.2

Released on December 1, 2011

  • 7 new 2D Slide transitions
  • 18 new 3D Sphere transitions
  • Added 5 new 3D Flips transitions
  • Added 4 new 2D Half transitions
  • Added 6 new 2D Multi transitions
  • Now contains 192 ready to use amazing effects!

Transitions Library, Version 1.0

Initial release of version 1. Released on September 1, 2011

About Chop Slider

"Chop Slider is the greatest and the most eyecatching animated jQuery image slider"

It is developed by the iDangero.us and it comes with the following features:

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

Transitions Library

Transitions Library is the additional script file that contains a lot, lot, lot of predefined transition effects:

  • 122 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
  • 60 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:

  • 5 sub-types of 3D Transition effect for full customization and flexibility: vertical3D (used in 3D Blocks), horizontal3D (used in 3D Blocks), multiFlip Vertical, multiFlip Horizontal (used in Multi Flip) and amazing 3D Spheres
  • 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. Only in Pro/Extended version

Content Slides - Any HTML Content Inside!

In addition to the slides with images, you can now (from v 2.2) use "Content" slides with any HTML inside - texts, videos, images, flash etc. You can combine image slides and content slides by adding special CSS class to the content slide. Chop Slider will automatically make small changes to transition parameters for the content slides. Content slides have four types of transitions:

  • From image slide to content slide. In this case selected transition will work like Half transition (for 2D transitions)
  • From content slide to content slide. In this case it will be simple slide transition
  • From content slide to image slide. Transition will work like inverted Half transition (for 2D transitions)
  • From/to content slide to/from image slide with selected 3D transition. Transition will be alway the same with simple 3D effect.

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.

Here is example how to choose different transitions from Transitions Library, very easy:

$("#my-slider").chopSlider({
	....
	t3D : csTransitions['3DFlips'][14], /* 14th from 3DFlips */
	t2D : [ csTransitions['multi'][10], csTransitions['vertical'][5] ], /* will be picked up randomly from these two */
	noCSS3 : csTransitions['noCSS3']['random'], /* will be picked up randomly from all noCSS3 transitions */
	mobile : csTransitions['mobile'][3],
	....
}) 

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

Here is example of "Multi-9" transition:

$("#my-slider").chopSlider({
	....
	/* 
	  We use only those options 
	  that are different from default ones
	*/
	t2D : {
		type: "multi",
		hPieces: 5,
		vPieces: 10,
		rotate : 90 ,
		rotateSymmetric: false,
		scaleX:0,
		scaleY:0,
		dur1: 1000,
		dur2: 1,
		dur3: 1000,
		pieceDelay : 60,
		multiDelay : "linear",
		startFrom:"middle"
	},
	....
}) 

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

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:

  • $.chopSlider.slide({options}) - this function allows to run custom transitions with the parameters different from default ones. This this function is useful for custom navigation control, it has such options like "direction" (to simulate Next or Previous transition) and "slideTo" (to simulate Pagination). Also it allows you to run the transition with totally different options! This function is used on the custom transition icons above
  • $.chopSlider.redefine({options}) - powerful function which allows to redefine all default parameters on the fly. For example it can be used to change the parameters of transitions without reloading of the slider (page), or it can be used to disable/enable autoplay, to disable/enable CSS3 effects, etc.
  • $.chopSlider.hasCSS3() function allows to determine if the user's browser supports CSS3 2D transitions or not
  • $.chopSlider.has3D() function allows to determine if the user's browser supports CSS3 3D transitions or not
  • $("#element").csTransform({options}) - additional crossbrowser (not IE) jQuery method. Allows to apply CSS3 transforms (or CSS3 animation) to any element

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

Autoplay

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.

Here is example of full HTML setup with captions and full navigation:

<!-- Next and Previous buttons: -->
<a id="slide-next" href="#"></a> 
<a id="slide-prev" href="#"></a>

<!-- Slides: --> <div id="slider">
<div class="slide cs-activeSlide"> <img src="images/slider/1.jpg" /> </div>
<div class="slide"> <img src="images/slider/2.jpg" /> </div>
<div class="slide"> <img src="images/slider/3.jpg" /> </div>
<div class="slide"> <img src="images/slider/4.jpg" /> </div>
</div> <!-- Pagination buttons: -->
<div> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> </div> <!-- Dummy hidden container with caption for every slide -->
<div>
<div class="sl-descr">First Slide Caption</div>
<div class="sl-descr">Second Slide Caption</div>
<div class="sl-descr">Third Slide Caption</div>
<div class="sl-descr">Fourth Slide Caption</div>
</div> <!-- Caption will be inserted here: -->
<div class="caption"></div>

Lightweight

Chop Slider is very lightweight:

  • Core Plugin - 8.4Kb minified and gzipped
  • Transitions Library - 5.2Kb minified and gzipped

Browser Support

Chop Slider was tested and compatible with the following browsers:

  • Internet Explorer v6+
  • Firefox v3+
  • Google Chrome v4+
  • Safari v4+
  • Opera v10+

Chop Slider 2 Wordpress Plugin

Chop Slider 2 comes with amazing and very powerful Wordpress Plugin. It has all mentioned above features that are combined with great Wordpress API, functionality, flexibility, ease of use and intelligibility.

"Creating incredibly powerful and exciting image sliders has never been so easy, interesting and fun like with Chop Slider 2 Wordpress Plugin!"

Easy Installation

Plugin comes with WP native installation, no need to upload files by files. All you need is to upload the plugin package via native WP Plugin Installation page

Own Menu Section

Plugin comes with its own admin Menu section with three pages: Dashboard (Management) page, Transtions Library and "Add New" page

CS Dashboard

Home page of Chop Slider 2 WP Plugin. Here you'll find information about all created Sliders, useful information about plugin versions, transition library state, links to the tutorial videos, latest tweets from Chop Slider

Native WP Interface

WP Plugin uses 100% native wordpress interface, there is no additional heavyweight images, styles and scripts.

Update-Checker

Chop Slider comes with exclusive "Check For Updates" feature. No need to follow and look for a new version. Just click on the "Check For Updates" button and you'll get information about new available versions!

Easy To Create

It's very easy to create new Chop Slider, the "Add New" page has a lot of interesting and self-explaining features

Native Uploader

Chop Slider 2 uses native WP image uploader / Media Library. So you can easily upload, resize, crop required pictures, and insert them to the Slider

Links and Captions

Easy to add hyperlink or caption with text/html for any slide

152 Transitions!

Choose any from 152 available 2D or 3D transition effects, or choose them all!

Manage Navigation

Use navigation that you need - arrows or pagination. Simply enable or disable elements you need

Visual Skins

There are five available Dinamic Visual Skins that are great to use for different purposes with different layouts

Custom Elements

If you do no like default skins you can use your own custom elements as pagination, arrows and captions

Full 3D

The most eye-catching effect of Chop Slider 2 is also available in Wordpress plugin.

Preview Generator

With this feature you can preview how the Slider will work with chosen images (slides) and with selected effects

Transitions Library

Plugin comes with integrated Transitions Library where you can see all available transitions effects

All possibilities for integration! You can integrate Chop Slider in three ways:

Shortcode

You can use Chop Slider's Shortcode to insert created Slider into the Post or Page. Plugin also adds new button to the text editor (in HTML mode) to make the inserting of Shortcode as simple as possible

Chop Slider Widget

Chop Slider 2 WP Plugin comes with its own widget. So you can easily insert required Slider into the sidebar, footer, header or any other available widget position!

Template Tag

If you need to integrate Chop Slider right into the Theme's files (for example into the header) you can use CS Template Tag (PHP function) for deeper integration

Resource-Saving Integration

Plugin adds all neccessary scripts (Core jQuery Plugin, Transitions Library and configuration scripts) only on the pages with Chop Slider. Plugin uses in-built JS, CSS and HTML "generators" to generate the required files for every Slider after you create (or edit) it. It is a good way to make the plugin works much faster, it will not make request to the database, parse a lot of variables to generate JS, CSS and HTML code with every integrated Slider on the page. But with pre-generated files it just includes ready to use JS, CSS and HTML files for the required Slider!

Documentation

Chop Slider 2 WP Plugin comes with full-illustrated 30-pages PDF documentation!

Requirements

Chop Slider 2 WP Plugin has been tested and compatible with Wordpress 3.0+ and jQuery 1.6+

Clean Uninstallation

Chop Slider 2 uses clean uninstallation. After you remove it, plugin will remove all created files and data tables from the data base!

Check out live videos of Chop Slider 2 Wordpress Plugin usage:

Create and integrate Chop Slider 2 to the Post or Page using shortcodes with official Wordpress plugin just for 3 minutes!

How to create and integrate Chop Slider 2 to Wordpress theme with a Chop Slider 2 widget just for 3 minutes!

This small video will show how to create, and integrate Chop Slider 2 to the Wordpress theme with Chop Slider 2 Wordpress plugin

Plugin walkthrough. Plugin installation. Create and integrate Chop Slider 2 with shortcode, with widgets. Example of Full 3D slider

Chop Slider 2 Wordpress Plugin, Common Features

  • Easy to install. Uses native WP installator
  • Manage Sliders - Add, Remove, Edit
  • Update checker
  • Plugin pages have native WP styling
  • Integrated Transitions Library to preview all available transitions effects
  • Upload images using native WP uploader (Media Library) which allows to resize and crop images
  • Flexible Slider's configuration
  • Text/HTML captions for evry slide
  • 5 Dynamic Visual Skins
  • Comes with 152 predefined and ready to use effects!
  • Integration with Shortcodes
  • Comes with its own Chop Slider 2 Widget
  • Integration with Template Tag (PHP function)
  • Resource-saving integration
  • Clean uninstallation
  • Preview generator
  • Extended documentation
  • Tutorial videos
  • Supports for custom styling
  • Very simple and self-explaining creation process
  • Supports for Full 3D
  • Slides as hyperlinks
  • Custom WYSIWYG button for the shortcode integration
  • Compatible with Wordpress 3.0+ and jQuery 1.6+
    Single | Multi Single | Multi
Price Free $12 $70 $120 $300
License Click to learn more
You can find more detailed information about these licenses right after this pricing table. Or you can read full licensing terms on the Licensing Terms page
RL 1 RL Limited 2 RL Limited 2 EL 3 EL 3
Plugins Click to learn more
All paid versions come with Chop Slider 2 Wordpress Plugin and PRO version of jQuery pluign
jQuery Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin
Number Of Websites Click to learn more

Free version do not limit the number of websites (or apps) where you are going to use Chop Slider

In Pro version the usage of Chop Slider is limited to a single application (in single version) and to 10 applications (in multi version)

Unlimited 1 10
Usage In Projects/Products For Sale Click to learn more
With Chop Slider Extended License you can use it in website template, app, paid game, or other software project for sale. Purchasing this version you will also get the signed License Agreement between You and Us for some specific project
1 5
Support Click to learn more
For commercial versions we provide support.

For Pro version we help to solve any problems with Chop Slider integration, customization, and will fix any bugs or errors that may occur.

For Extended version we provide additional script's customization to match any needs

Lifetime Updates
Documentation Click to learn more
Chop Slider comes with full illustrated PDF documentation and live demos
Transitions
2D Transitions Click to learn more
Every version supports 3 main types of 2D Transitions - "Vertical", "Horizontal" and "Multi"
"Half" Mode Click to learn more
By enabling this mode the transition effect will have only the half of the full transition proccess. This is the fastest and the most smooth type of transition
"Sexy" Mode Click to learn more
Special mode when the slices have rounded corners. This mode also comes with special option which automatically creates square slices to make the correct circles. At the moment rounded corners in this mode do not work in Opera and IE
Transitions Library Click to learn more
Chop Slider comes with 152 predefined and ready to use transition effects
Random Transition Parameters Click to learn more
Almost all parametric options can be set to "random" value. So it is possible to create full-random or soft-random transitions (e.g. you can set only one parameter to "random")
Random Transitions From Library Click to learn more
On the Slider's initialization you can set not some specific transition but even some "transitions group" or whole Transitions Library. In this case, every time you run the transition, the effect will be picked up randomly
Custom Transitions Click to learn more
Chop Slider allows you to create unlimited number of custom unique transitions and to be fully creative
Only in jQuery Plugin Only in jQuery Plugin Only in jQuery Plugin Only in jQuery Plugin Only in jQuery Plugin
Content Slides
Content Slides Click to learn more
From 2.2 version you can use slides with any HTML content - text, videos, flash, etc.
Chop Slider 3D
3D Transitions Click to learn more
3D Transitions - the most eyecatching type of transition effects. Every version supports two main types of 3D Transitions - "3D Blocks" and "3D Flips". At the moment 3D Transitions work only in Webkit browsers - Chrome and Safari
3D Spheres Click to learn more
3D Spheres - the most eyecatching and absolutely unique 3D effect.
3D Container Click to learn more
This option allows you 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
Full 3D Mode Click to learn more
This option sets all slides in 3D and will hold it
Effects Degradation
"No CSS3" Transitions
"Mobile" Transitions
Effects Auto Degradation
Navigation
Pagination
"Next" and "Right" Triggers
Built-in Navigation Control
Custom Navigation Control
Captions
CaptionsClick to learn more
Chop Slider supports any HTML formatting for the Captions. So you can put there any links, images, headings, text, etc..
Built-in Captions ControlClick to learn more
Chop Slider has two default types of Captions Control. First one is when the Caption fades-in after the transition, like on this demo page. And if you will specify additional parameter "captionTransform", the caption will be shown with CSS3 transform animation
Custom Captions Control
Chop Slider API
Call Back API Click to learn more
With this option you can run functions before and after animating between slides. Run your own custom animations, reactions, and process after transition to specific slides
External API Click to learn more
Six additional external function/methods. You can use them to create your own Captions/Navigation Control, to run transitions with different effects, to enable/disable some features like Autoplay (You can create Play/Pause buttons), etc
Additional .csTransform() Method Click to learn more
Additional crossbrowser (not IE) powerful jQuery method. Allows to apply CSS3 transforms (or CSS3 animation) to any element on your website. For example this tooltip made with this method.
Other Features
AutoplayClick to learn more
Chop Slider supports Autoplay feature with custom delay time.
Slides as Hyper LinksClick to learn more
You can wrap your slides with <a> tag to make it a hyper-link.
SkinsClick to learn more
Chop Slider 2 Wordpress plugin comes with 5 ready to use visual skins with different layouts of Navigation Elements, Captions and Slides' decoration
Only in Wordpress Plugin Only in Wordpress Plugin Only in Wordpress Plugin Only in Wordpress Plugin
Full CSS CustomizationClick to learn more
Chop Slider has no limitation for styling, so you can customize it like you need
Download / Buy
Price Free $12 $70 $120 $300
Plugins Click to learn more
All paid versions come with Chop Slider 2 Wordpress Plugin and PRO version of jQuery pluign
jQuery Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin jQuery Plugin Wordpress Plugin
Download / Buy Download Purchase Purchase Purchase Purchase
    we accept all major credit/debit cards

1 RL - iDangero.us Regular License. Read full Licensing Terms.

2 RL Limited - iDangero.us Limited Regular License. The difference between RL and RL Limited is that your use of the Chop Slider is limited to a single application (Single version) or to 10 applications (Multi Version). Read full Licensing Terms.

3 EL - iDangero.us Extended License. This license gives you a right to use Chop Slider in website template, app, paid game, or other software project for sale. Purchasing this version you will also get the signed License Agreement between You and Us for some specific project. Read full Licensing Terms.

Don't forget to checkout other iDangero.us products:

Jump Box CorporatesPhotos - Photography PortfolioRotatr - Countdown TemplateSky Line - Ultimate Desktop TemplateJumpBox - Resume/PortfolioLauncherX - Countdown TemplateDevice - Desktop Style TemplateDesignia - Colorful DesignLauncher - Launch Page TemplateEvolette - Ajax Administration

Amazing Offer - iDangero.us Total Bundle

Total Bundle Incredible bundle for incredible price. All iDangero.us items just for so small price. This bundle is a good way to save some money and to replenish your templates collection with 20 premium items (including Chop Slider 2 Pro-Single) just for...
... just for $ 45 !

Have Questions or Find a Bug?

If you have any questions about Chop Slider itself, about Licensing, or find any bug or error feel free to send us email to [email protected] You can also contact us via Contact Page or use Support Ticket

Follow Us

Chop Slider on Twitter | iDangero.us on Twitter | Become our fan on Facebook

Like Us

close