Revolution Slider

Lazy Loadingdocumentation exmaple

This example is provided by the vendor. This is also included on purchased version!
You can easy edit any example using caption & transition editor.
Revolution Slider - one of the most powerful available sliders!

Powerful

Multipurpose

Atropos Multipurpose Template, now offering you
over 110 html pages fully customizable and very
easy to use! Read more...

110+

Html Pages

Fully Responsive

Customizable Pages
ATROPOS

FRESH NEW VERSION

Atropos

POWERFUL

MULTIPURPOSE

V1.2

Atropos is a multipurpose template for
business or portfolio website. It is
fully responsive design ready for
PC, Tablet and Mobile.
Caption Selection

Custom Animation Editor

With Live Preview

With Style Preview

Big

Improvements

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>