Additional JavaScript Settings

Additional JS Settings

1. Autoplay / Randomize

Disable Autoplay:

jQuery('#rev_slider_1').show().revolution({

    stopLoop: 'on',
    stopAfterLoops: 0,
    stopAtSlide: 1,

    /* ****************** */
    /* settings continued */
    /* ****************** */

});

Auto-Rotate:

jQuery('#rev_slider_1').show().revolution({

    stopLoop: 'off',
    stopAfterLoops: -1,
    stopAtSlide: -1,

    /* ****************** */
    /* settings continued */
    /* ****************** */

});

2. Dotted Overlay / Shadows

Dotted Overlays:

Options are “twoxtwo”, “twoxtwowhite”, “threexthree” and “threexthreewhite”.

jQuery('#rev_slider_1').show().revolution({

    /* 2x2 transparent dotted overlay graphic */
    dottedOverlay: 'twoxtwo',

    /* ****************** */
    /* settings continued */
    /* ****************** */

});

Shadows:

Choose a number between 1-6 to preview the different available shadow options.

jQuery('#rev_slider_1').show().revolution({

    /* 1-6 drop-shadow options */
    shadow: 1,

    /* ****************** */
    /* settings continued */
    /* ****************** */

});

3. Mobile Visibility / Fallbacks

hideThumbsOnMobile

Hide thumbnail navigation for mobile devices.

hideSliderAtLimit

Hide the entire slider below a certain screen size.

hideCaptionAtLimit

Hide specific Layers below a certain screen size.

hideAllCaptionAtLimit

Hide all Layers below a certain screensize

fallbacks -> simplifyAll

Convert to simple animations for older iOS and IE.

fallbacks -> nextSlideOnWindowFocus

Automatically change to the next slide when the user returns after switches tabs/windows.

fallbacks -> disableFocusListener

Disable the window/tab change event listener.

jQuery('#rev_slider_1').show().revolution({

    hideThumbsOnMobile: 'off',
    hideSliderAtLimit: 0,
    hideCaptionAtLimit: 0,
    hideAllCaptionAtLilmit: 0,

    fallbacks: {
        simplifyAll: 'on',
        nextSlideOnWindowFocus: 'off',
        disableFocusListener: false
    }

    /* ****************** */
    /* settings continued */
    /* ****************** */

});

Replace the entire Slider with a simple Image for mobile or IE8

data-aimg

The url of the image to be displayed instead of the slider.

data-amobile

Use the alternative image on mobile devices.

data-aie8

Use the alternative image when IE8 is detected.

4. Stop Slider out of Viewport

Options that can be used to pause/resume the slider when the slider is scrolled into and out of view on a web page. And also useful for only starting the slider once its been scrolled into view (for sliders that exist “below the fold”).

viewport -> enable

true
false

Enables the Viewport options.

viewport -> outof

wait
pause

Enter "wait" to start the slider when its scrolled into view, and "pause" to pause/resume the slider when its scrolled into and out of view.

viewport -> visible_area

Start/Pause/Resume the slider when it is scrolled out of view by a certain percentage.

viewport -> presize

true
false

Calculate the slider's size ahead of time (used in combination with "viewport -> outof -> wait").

jQuery('#rev_slider_1').show().revolution({

    viewPort: {
        enable: true,
        outof: 'wait',
        visible_area: '80%',
        presize: true
    },

    /* ****************** */
    /* settings continued */
    /* ****************** */

});