TIP LazyLoadPlugin is not installed on Foswiki.org.

LazyLoadPlugin

deferred loading of images

This plugin allows to defer loading of images within a section of a page.

This is done by first parsing out all src attributes of the img tags contained, and then by registering these images to the jQuery plugin by Mika Tuupola (http://www.appelsiini.net/projects/lazyload).

Unfortunately - as mentioned by Mika - a pure JavaScript solution does not work anymore with modern browsers as these collect and download all image sources before handing over control to the JavaScript interpreter. While this is good for the overall page loading performance, there's no way to stop this download process from within JavaScript as far as I know. So the only way to prevent images being already loaded is to replace the original value of the src attribute of img tags with a placeholder image, e.g. a white dot, and remember the original image location in a html5 data-src attribute. The lazyload jQuery plugin will then take over control when to patch in the real src value again based on the scroll state of the viewport of the browser window. This will then trigger the browser to download the image.

Usage

%STARLAZYLOAD%

images go in here

%ENDLAZYLOAD%

Note that you won't need to surround an %IMAGEGALLERY tag of Foswiki:Extensions/ImageGalleryPlugin with %START/ENDLAZYLOAD macros as ImageGalleryPlugin supports lazy loading of images automatically from version 5.2 onwards.

Installation Instructions

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. Use "Find More Extensions" to get a list of available extensions. Select "Install".

If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See http://foswiki.org/Support/ManuallyInstallingExtensions for more help.

Dependencies

NameVersionDescription
Foswiki::Plugins::JQueryPlugin>=4.10Required

Change History

27 May 2016: upgraded to lazyload 1.9.7; disable itself in static content such as print-outs
28 Aug 2014: upgraded to lazyload 1.9.3
14 Mar 2013: upgraded to lazyload 1.8.2
10 Mar 2012: upgraded to latest version of lazyload 1.7.2
30 Sep 2011: fixed dependency on jquery.metadata
Topic revision: r8 - 27 May 2016, MichaelDaum - This page was cached on 09 Dec 2016 - 14:41.

The copyright of the content on this website is held by the contributing authors, except where stated elsewhere. See Copyright Statement. Creative Commons License