From our sponsor: Leverage AI for dynamic, custom website builds with ease.
We have updated the Slit Slider tutorial, fixed some issues and made the slider responsive. Check out the original tutorial to find out more about it and how to use it.
Demos
We’ve improved the original demo and because of some requests we’ve added another one which shows how the slider can be used in full width, fixed height and background images. Both of them are responsive:
- Demo 1: Fullscreen with different background colors, dot navigation and arrow navigation
- Demo 2: Full width with background images
Summary of Changes
A lot of changes were integrated into the new Slit Slider, here are the most important ones:
- The slider can now be used in a responsive context, simply set the wrapper’s width to a percentage and it will adapt.
- The Transit plugin was removed.
- We’ve added public methods for navigation control: next, previous and specific slide. This will make it possible to use custom controls.
- Keyboard navigation has been added (right and left arrow keys).
- The Firefox bug has been fixed.
- We’ve added callback functions for before and after each slide transition.
- New method for dynamically adding new slides.
- Some other bug fixes, like flickering etc.
