• Register
Home  //  Tutorials  //  Lazy Load Setup
Lazy Load Images
PDF
Print
E-mail
Written by Administrator   
Friday, 12 August 2011 18:35
The lazy load script is a great way to save bandwidth and load your pages much faster. Images that are not visible on the initial page load are not loaded or downloaded until they come into the main viewing area. Once an image comes into view it is then downloaded and faded into visibility. Scroll down this page to see the script in action.

Setup is very easy! By default this script is disabled, in order to enable it simply choose All Images or Individual Images from the drop down, as shown below from inside the template configuration page.



All images will load every standard image on the page with lazy load. There is no extra configuration or extra code to add with this configuration, it will just happen automatically. Individual images would be used if you want only certain images to load with this script and not all of them. To do this simply add class="s5_lazyload" to the image like so:
<img class="s5_lazyload" src="http://www.yoursite.com/image.jpg"></img>


This script is compatible with Firefox3+, IE8+, Chrome14+, Safari5.05+, Opera 11.11+

See the script in action:


Last Updated on Tuesday, 11 October 2011 18:10
 

Demo Information

All content and images shown on this site is for demo, presentation purposes only. This site is intended to exemplify a live and published website and does not make any claim of any kind to the validity of non-Shape5 content, articles, images or posts published to this site.

Bigtownville, CO, USA 12345
Email: [email protected]
Web: www.shape5.com/demo

New Games We Are Playing At Our Clan

Donec sit amet nibh. Viva lacer elitem mus lor em et non arcu. Lorem ipsum dolor sit amet, lacer sit emruc onsecte tur adipiscing elit. Etia dapibus lace Viva lacer elitem mus non arcu em mus non arcu. Lorem ipsum dolor sit Viva lacer elitem mus non arcu em mus non lacer.
Lamet, lacer non consectetur adipiscing elit. Etiam dapibu donec sit amet nibh. Viva lacer elitem mus lorem et non arcu. Lorem ipsum dol or sit amet, lacer sit emruc onsecte tur adipiscing elit. Viva lacer elitem mus non arcu em mus non arcu. Etia lacer elitem mus non arcu ipsum.