Aug 11, 2018
0 0

CodingJack’s 3D Carousel

Written by



  • Real 3D using CSS3 3D Transforms
  • 3D carousel appears on Chrome, Firefox, Safari, iOS and Android
  • A grid style backback will be displayed for IE (see screenshot below or test preview in one of these browsers to view a live preview of the gridbackback)

Tablets and Phones with Touch Swipe

The carousel is supported on iOS and Android and includes touch swipe functionality. It looks great on a tablet and even works on a smartphone. But because the carousel can appear small on smaller screens, I have included two special features for smartphones:

  • Option to display a thumbnail instead ("backback" presentation)
  • Possibility to transform the gridback into a responsive layout. See either preview from your phone for an example.

Customization settings include

  • Select the "auto spin" carousel.
  • Change the initial "zoom / spin" animation on and off
  • Swap HTML5 Canvas "shine" turns the power on and off
  • Choose to use image reflections
  • Customize the 3D values ​​shown in the previews
  • Set the auto game speed as well as the mouse's interaction speed
  • Product names are optional
  • Select to automatically display captions
  • Hyperlinking is optional

jQuery Carousel

Grid slope for IE

Applied technologies

Special notes

  • CSS3 3D is still considered as experimental technology by the most important browsers. The settings that can be adjusted in the example shown show the different looks you can create. But if you want to make a look that can not be recreated in the preview (ie have a carousel with 100 items, etc.), please keep in mind that we are bound by the technology limitations and that there is no guarantee. The special Settings you want to use allow for a smooth carousel experience.
  • Although IE10 + supports some parts of CSS3 3D, important parts are not supported for the carousel to work (specifically, transform style: preserve-3d;). When IE10 + adds support for this, I update the carousel. Until then, all versions of IE, including IE10 +, will display the tray.
  • Preview shown here on CodeCanyon with all carousel controls is not included in the download source, but if you think for some reason to have these controls important to your site visitors, please send me an email from my profile page and I & # 39; I will send you the preview source files.
  • Images used in preview are for demonstration purposes only and are not included in the download source
  • This is NOT a WordPress plugin

More works by CodingJack

jQuery Gallery

jQuery Banner Rotator

jQuery Banner Rotator


Article Tags:
Article Categories:
ThemeForest best selling themes

Jaeho Park completed a Master in Fine Arts at the Hongik University in 1999, followed by a Master in Photographic Studies at the University of Westminster in 2012. After working for many years as a university professor, designer and curator in South Korea.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.