CodingJack's 3D Carousel

CodingJack’s 3D Carousel

-> WORDPRESS VERSION ADDITIONALLY AVAILABLE

• Actual 3D the usage of CSS3 3D Transforms
• 3D Carousel shall be proven on Chrome, Firefox, Safari, iOS and Android
• A grid style fallback will be displayed for IE (see screenshot below or take a look at the preview in one of those browsers to view a live preview of the grid fallback)

Drugs and Phones with Contact Swipe

The carousel is supported on iOS and Android and contains contact swipe capability. It seems nice on a pill and can even work on a smartphone. However since the carousel can seem small on smaller monitors, I’ve included unique options for smartphones:

• way to display a thumbnail grid as a substitute (the “fallback” presentation)
• option to develop into the grid fallback into a responsive layout. View either preview from your telephone for an example.

Customizable Options Include

• Decide To “car spin” the carousel.
• Toggle the initial “zoom/spin” animation on and off
• Toggle the HTML5 Canvas “shine” hover impact on and stale
• Choose To use symbol reflections
• Customise the 3D values proven in the previews
• Set the autoplay speed as well as the mouse interplay velocity
• Merchandise captions are non-compulsory
• Choose To vehicle-show merchandise captions
• Hyperlinking is optional

Grid Fallback for IE

Technologies Used

• HTML5
• CSS3
• jQuery
• Jacked
• HTML5 Shiv
• Icons courtesy of Navdeep Raj

Special Notes

• CSS3 3D continues to be regarded as experimental generation by the most important browsers. The settings that may be adjusted in the preview proven here exhibit the various appears to be like you'll create. but if you would like to create a glance that can’t be recreated within the preview (i.e. have a carousel with 100 pieces, etc.), please stay in mind that we’re certain by means of the era’s boundaries, and that there's no ensure the particular settings you would like to make use of will permit for a clean carousel revel in.
  
  
• Although IE10+ supports a few portions of CSS3 3D, vital parts which might be needed for the carousel to paintings are not supported (specifically, develop into-style: preserve-3d;). When IE10+ provides support for this I’ll replace the carousel. Until then all variations of IE, including IE10+ will show the fallback grid.
  
  
• The preview proven here on CodeCanyon with all the carousel controls isn't incorporated with the obtain source, but if for some reason why you think that having the ones controls is very important for your site guests, feel free to send me an email from my profile page and i’ll send you the preview’s source recordsdata.
  
  
• Pictures used in the preview are for demonstration objective best and aren't included in the download supply
  
  
• this is NOT a WordPress Plugin

More works by CodingJack

FULL DOWNLOAD