Super Carousel plugin allows the carousel to be viewed in response to the size of the screen or web browser one is viewing with different visibility options. It comes with three responsive modes. Responsive by Visible, by Item Width and by Item Height.
The responsive modes are "display area" size specific. Pre-defined different modes can be applied for Desktops, Laptops, Tablets and Mobiles. Due to responsive nature and to maintain the aspect ratio, either one of the responsive modes can be applied at time.
In addition, it gives an option to apply custom visibility settings.
Width Specific, Responsive By Visible
The carousel item width is calculated based on the number of visible items configured to disable at a time.
For Desktop Width, Visible 5. For Laptop Width, Visible 4, For Tablet Width, Visible 3 and Mobile Width, Visible 1.
Carousel Item width is calculated by the number of visible items configured, and the Item Height is auto calculated preserving the aspect ratio.
Fix height can also be configured with fixed visible items, but that may result to crop images to avoid stretching.
Responsive By Item Width
The carousel item width is fixed regardless of the device width.
In the below image carousel, Item Width in Desktop 450px, Laptop 300px, Tablet 200px and Mobile 150px. Carousel Item width is fixed, and the Item Height is auto calculated preserving the aspect ratio.
Fix height can also be configured with fixed item width, but that may result to crop images to avoid stretching.
Responsive By Item Height
The carousel item height is fixed with auto width, preserving the aspect ratio.
Item Height 150px in Desktop, Laptop, Tablet and Mobile. Carousel Item Height is fixed, and the Item Width is auto calculated preserving the aspect ratio
Fix width can also be configured with fixed item height, but that may result to crop images to avoid stretching.
