
by
Janeth Kent
Date: 25-04-2013
Lazy Load, is a plugin that allows you to defer image loading until the image is scrolled to.
Options and Events
Options for LazyLoad include:
- range: (defaults to 200) The amount of space from the container’s bottom position that you want to look for images to load.
- image: (defaults to “blank.gif”) The image to replace the original image.
- resetDimensions: (defaults to true) Removes the image’s width and height attributes.
- elements: (defaults to “img”) Images to consider for lazy loading.
- container: (defaults to window) The container for which to look for images within.
- mode: (defaults to “vertical”) The mode for which the plugin will adjust to.
Events for LazyLoad include:
- Complete: Fires when all images have been loaded.
- Load: Fires on each individual image once it has been loaded.
- Scroll: Fires when the container is scrolled.
How it works
Step 1: JQuery
<script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> .google.load("jquery", "1.3.2"); </script>
Step 2: Lazyload.js
<script src="URL/VERSO/jquery.lazyload.js" type="text/javascript"></script>
Step 3: Initialize LazyLoad
<script type="text/javascript"> jQuery(document).ready(function(){ $("img").lazyload({ failurelimit : 50, effect : "fadeIn" }); }); </script>
Look at the Lazy Load Demo.
by
Janeth Kent Date:
25-04-2013
hits :
1624

Janeth Kent
Licenciada en Bellas Artes y programadora por pasión. Cuando tengo un rato retoco fotos, edito vídeos y diseño cosas. El resto del tiempo escribo en MA-NO WEB DESIGN END DEVELOPMENT.