• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Lazy Load [img] 1.2.4

No permission to download
  • Fix bug where image thumbnails are not displayed at correct dimensions

Thanks @Ralle
For attachments built an inline SVG which reserves the space for the image, hopefully removing jank for attachments. This should work for modern browsers, but older browsers may see a broken image until the actual image loads.

Thanks @Ralle
  • Use javaScriptSource to support CDN/alternative javascript paths
  • Fix an issue the image would not resize when resizing the window smaller.
  • Bugfixes to XFMG integration. Thanks @Nuno
Thanks to @Nuno for contributing.
  • Adds support for lazyloading the thumbnail image.
  • Update lazysizes javascript library to 2.0.7
Fix distortion image aspect ratio for attachments.
Replaced lazyloading script 'unveil' with 'lazysizes. Browser support is at least IE9, or Firefox, or Chrome.

Provides a much smoother lazy-loading experience, and better client performance.

Unveil effects
Add styling to your theme for the classes: lazyload, lazyloading, lazyloaded.

Fade in
CSS:
/* fade image in after load */
.lazyload,
.lazyloading {
    opacity: 0;
}
.lazyloaded {
    opacity: 1;
    transition: opacity 300ms;
}
Spinner
CSS:
/* fade image in while loading and show a spinner as background image (good for progressive images) */

.lazyload {
    opacity: 0;
}

.lazyloading {
    opacity: 1;
    transition: opacity 300ms;
    background: #f7f7f7 url(loader.gif) no-repeat center;
}
Ensure the Lazy Loader javascript is only loaded when required rather than being loaded globally.
Likes: Amin Sabet