Please note, this is a STATIC archive of website www.themepunch.com from 28 Sep 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

“Film Strip” Slider Example

A carousel-style slider where the Layer content is always visible.
Uses the Premium Team Slider template as a converted example, but can be setup for any given slider.

Setup Instructions:

  • Important Note:
    The example here is a specialized slider that requires the regular animations to be turned off.
1. Create a new Slider with a "Standard Slider" slider-type.
standard-slider
2. Disable Autoplay for the Slider (not mandatory but recommended).
stop-slider
3. Enable Touch Swiping Navigation (will also enable mouse-drag/drop functionality on desktop).
enable-touch
4. Enable Left/Right Key and Mouse-Wheel Navigation Controls
mouse-key-nav
5. Set the Slide Animation to "No Transition" for each of your Individual Slides.
no-transition
6. Set the Animation for all content Layers to "No Animation" for both the start and end settings.
no-animation
7. Add the following CSS to the slider's Custom CSS section.
https://pastebin.com/nKMsa9sE

Edit the scrollbar colors toward the top of the CSS if desired:
custom-css
8. Add the following JavaScript to the slider's Custom JavaScript section.
https://pastebin.com/Dp7rDXuR

Edit the "revapi" part toward the top with your slider's ID number, and also enable/disable the optional scrollbar.
custom-js