Slider Revolution 6.3 NOW available!

Optional Preloader/Spinner:





/* slider's main JavaScript settings */
jQuery('#rev_slider_1').show().revolution({
 
    sliderLayout: 'auto',
    gridwidth: 1240,
    gridheight: 868,
 
    /* PRELOADER OPTION "0" */
    spinner: 'spinner0',
 
    /* ****************** */
    /* settings continued */
    /* ****************** */

Lazy Loading:

Lazy Load the Slide's main Background:

<!-- BEGIN SLIDE -->
<li data-transition="fade">
 
    <!--
        "small transparent image loaded by default,
        and real image url added as the image's "data-lazyload" attribute
    -->
    <img src="assets/images/dummy.png"
         data-lazyload="assets/images/notgeneric_bg5.jpg"
 
         alt="Ocean"
         class="rev-slidebg"
         data-bgposition="center center"
         data-bgfit="cover"
         data-bgrepeat="no-repeat">
 
</li>
<!-- END SLIDE -->

Lazy Load an Image Layer:

<!-- BEGIN IMAGE LAYER -->
<div class="tp-caption tp-resizeme" data-type="image"
     data-frames='[{"delay": 500, "speed": 300, "from": "opacity: 0", "to": "opacity: 1"},
                   {"delay": "wait", "speed": 300, "to": "opacity: 0"}]'>
 
    <!--
        "small transparent image loaded by default,
        and real image url added as the image's "data-lazyload" attribute
    -->
    <img src="assets/images/dummy.png"
         data-lazyload="assets/images/ihpone_dark.png"
 
         alt="App Store"
         width="260"
         height="450">
 
</div>
<!-- END IMAGE LAYER -->

Declare a "LazyLoad Type"

“all” = All images will be Lazy Loaded by default.

“smart” = Lazy Load images from the current slide, the previous slide, and the next slide.

“single” = Only Lazy Load images from the current slide.

“none” = No Lazy Loading by default

/* slider's main JavaScript settings */
jQuery('#rev_slider_1').show().revolution({
 
    sliderLayout: 'auto',
    gridwidth: 1240,
    gridheight: 868,
 
    /* Lazy Load options are "all", "smart", "single" and "none" */
    lazyType: "smart",
 
    /* ****************** */
    /* settings continued */
    /* ****************** */

Popular Solutions