# SLIDER REVOLUTION - The Responsive Slider Plugin

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18

- Faster
  &
  More
  Powerful
  Slider Revolution is the highly acclaimed
  slide-based displaying solution, thousands of
  businesses, theme developers and everyday
  people use and love!
  1000's
  Of Happy Users
  Rekord Breaking
  Sales on CodeCanyon
  A Professional Solution
  4.7/5 Stars
  Customer Rating
- Caption Selection
  Custom Animation Editor
  With Live Preview
  With Style Preview
  Big
  Improvements
- Design
  &
  Create
  With Total Layer Control
- Timelined Captions
  Create Custom Animations
  with our Brand-New
  Transition Builder
- Extensive Video Support
  Youtube
  Vimeo
  Self-Hosted HTML 5
  Next Slide: Full Screen Video

## How to activate the lazy loading ?

In such situation it is better to activate the Lazy Loading option to load the images first when they really should be shown in the slider. Lazy Loading is only available for the Main images in the current version.Follow the steps to actiavet Lazy Loading

### Use blank images as sources instead of the original Images, and use the data-lazyload parameter:

    		<li data-transition="fade" data-slotamount="7" data-masterspeed="1500" >
    			<!-- MAIN IMAGE -->
    			<img src="images/dummy.png" data-lazyload="images/slidebg1.jpg"   alt="slidebg1"  data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
    			...

### Initialise the Plugin somewhere in the Body Footer:

    	  	<script type="text/javascript">

    				var revapi;

    				jQuery(document).ready(function() {

    					   revapi = jQuery('.tp-banner').revolution(
    						{
    							delay:9000,
    							startwidth:1170,
    							startheight:500,
    							hideThumbs:10,
    							lazyLoad:"on"

    						});

    				});	//ready

    			</script>