Looking for more? Go Pro!

Change your limits with an upgrade to our exclusive VIP accounts, direct downloads your favourite premium styles and add-ons with daily basis updates..
It’s easy and fast to join the VIP account upgrades with several payment methods.

SignUp Now!
  • We've added extra Spam Protection. if you get problem with account registration / registration rejected. please contact us
Compatible XF 2.x versions
  1. 2.1
  2. 2.2
Additional Requirements
php 7.0+
Require Client Browsers to be at least IE9, Firefox or Chrome.
Visible branding
No
Provides lazy loaded image support via the Lazysizes

A zero query method for per user-group lazy loading of the and [attach] tags in threads and conversations.

Uses a noscript tag around the original img tag.

Option to force lazy loading of contents in a spoiler tag.

[B]Permissions:[/B]

Adds the permission:

[LIST]
[*]Enable Lazy Load Images
[/LIST]
For "Forum Permissions" and "Conversation Permissions" sections.

[B]Options:[/B]

[IMG alt="1604583144578.png"]https://xenforo.com/community/attachments/1604583144578-png.239104/


  • Enable Outside threads/Conversations
    • permits the lazy loading bbcode injection to run outside of those contexts. Inside those context it will still respect permissions.
  • Force lazy loaded spoiler'ed images
    • Ignores permissions, and lazy loads images in spoilers
  • Lazy load icons
    • Lazy load user avatars, resource icons, and threadmark icons.
      This uses browser native lazy loading.
  • Use native lazy loading
    • Requires a modern browser, otherwise falls back to js library code
  • Inject blank SVG for attachment

Unveil effects
Add styling to your theme for the classes: lazyload, lazyloading, lazyloaded. This can be done by the provided style classes

Fade in
Fade image in after load.

In; Lazy loading and Lazy loading in progress


CSS:

opacity: 0;

In Lazy loading finished add;


CSS:

opacity: 1;
transition: opacity 300ms;


Spinner
Fade image in while loading and show a spinner as background image (good for progressive images)

In; Lazy loading;


CSS:

opacity: 0;

In Lazy loading in progress;


CSS:

opacity: 1;
transition: opacity 300ms;
background: #f7f7f7 url(loader.gif) no-repeat center;


A "loader.gif" image is not provided by this add-on!

Licensing:

Lazysizes is MIT Licensed, as of 2020-06-07.
Original source is aFarkas/lazysizes



Contributing features or bug fixes
Please create a Github Pull request via the "More Information" link.

Contributions

If you appreciate this addon, please consider a contribution via PayPal. Details will be provide via private conversation.

Please contact me if you wish for different licensing arrangements.
  • options.png
    options.png
    11.4 KB · Views: 71
Author
Ali Raza
Downloads
32
Views
1,111
First release
Last update
Rating
5.00 star(s) 1 ratings

More resources from Ali Raza

Latest updates

  1. 2.5.0 - XF2.2 compatibility update

    Requires php 7.0+ Require Standard Library by Xon Rename various options to be consistantly...
  2. 2.4.1 - Bugfix update

    Fix possible race condition between lazysize library's configuration and native loading support...
  3. 2.4.0 - Feature update

    Support native lazy loading for; Avatars, resource and threadmark icon's (default enabled) bb-code
  4. 2.3.0 - Maintenance update

    Require XF2.1+, drop XF2.0 support Update to lazysizes v5.2.0 from v5.1.2
  5. 2.2.1 - Maintenance update

    Improve extending XF js to be better compatible with other add-ons
Top