Lazy Load [img] 1.3.1

[Stuart Wright]

Thanks for this addon, which is working well on AVForums. As usual there are some people who don't like it. How difficult would it be to have an option in the user preferences to switch it off, please?

 

[Xon]

Thanks for this addon, which is working well on AVForums. As usual there are some people who don't like it. How difficult would it be to have an option in the user preferences to switch it off, please?

Atm, what I do is a custom field which triggers a user promotion to add them to a user group with the option enabled. This will take about 10-25 minutes to setup in the XenForo AdminCP

An actual user option wouldn't be much work, but it comes down to scheduling. But it will be about a week or two before I can work on it.

 

[Stuart Wright]

Atm, what I do is a custom field which triggers a user promotion to add them to a user group with the option enabled. This will take about 10-25 minutes to setup in the XenForo AdminCP

An actual user option wouldn't be much work, but it comes down to scheduling. But it will be about a week or two before I can work on it.

We have too many usergroups already, so I'm reluctant to add another just for this.
No rush for it from my point of view. It's a 'nice to have' feature and not at all important if it significantly affects performance.
Thanks

 

[rafass]

I don't think this is a good suggestion.
a faster transition is almost unnoticeable.
.lazyloaded {
transition: opacity xxxms;
}

 

[BobbyWibowo]

Working fine on my board, so far. Thanks!

 

[rafass]

someone else interested in extend the lazy images in the Media Gallery?

 

[Jake B.]

@Xon does this work with attachments, or only images loaded using the [img] tag?

 

[Xon]

@Xon does this work with attachments, or only images loaded using the [img] tag?

It works on the attachments and images.

 

[BobbyWibowo]

This add-on seemed to be working with Chat by @Siropu add-on. I was wondering, would it be possible to prevent this add-on from lazy-loading images on that chat?

EDIT: Never mind, I seemed to have "Enable Outside threads/conversations" option enabled.

 

[maxicep]

Thank you for your add-on firstly. I have some questions.

1. Any way to add font awesome animated spin icon as Loading icon of images?
2. Is possible to add that lazy loading to user avatars too ?

Thanks @Xon

 

[Xon]

Thank you for your add-on firstly. I have some questions.

1. Any way to add font awesome animated spin icon as Loading icon of images?
2. Is possible to add that lazy loading to user avatars too ?

Thanks @Xon

You should be apply it as CSS to add the font awesome icon, and then manually setup the CSS spinning. But there is no direct support for font awesome CSS classes.

It is currently not supported for lazy loading avatars.

 

[BobbyWibowo]

On my case, I never really see the spinning icon anywhere. But I can tell that images are being lazy-loaded. Something wrong or that's just how it's designed recently?

 

[Xon]

On my case, I never really see the spinning icon anywhere. But I can tell that images are being lazy-loaded. Something wrong or that's just how it's designed recently?

By default, this add-on doesn't activate a CSS spinner. You need to implement the CSS yourself.

 

[BobbyWibowo]

@Xon Ahha! Well, I have no plan to enable any kind of spinner though. It's just that I believe I've seen a spinner GIF file included in the package somewhere before, but it was never visible on the site.

 

[Xon]

@Xon Ahha! Well, I have no plan to enable any kind of spinner though. It's just that I believe I've seen a spinner GIF file included in the package somewhere before, but it was never visible on the site.

Correct, it includes one it just doesn't use it

 

[BobbyWibowo]

@Xon It seems like I do need a spinner. Huge size images take a while for me to load, and sometimes it confuse me whether there are images or not when the post is within view. Which CSS class do I need to target to apply the spinner thingy?

 

[Xon]

@Xon It seems like I do need a spinner. Huge size images take a while for me to load, and sometimes it confuse me whether there are images or not when the post is within view. Which CSS class do I need to target to apply the spinner thingy?

Under "Unveil effects" on the overview page is some example CSS.

 

[rafass]

I'm seeing the class "lazyload" can be extended even to custom icons like FA:

​

Adding directly that class like:

<i class="fa fa-circle lazyload"></i>

Could be possible add a little script somewhere to add lazyload in all the icons?

 

[BobbyWibowo]

Why lazyload individual FA icons though?

 

[rafass]

I'm using this script to inject the class in PAGE_CONTAINER and works perfectly:

<script type='text/javascript'>
    $(document).ready(function(){
      $('.fa').addClass('lazyload');
});
</script>

However it doesn't work on the icons added with CSS using :after :before like:

.node.node_xx .forumNodeInfo .nodeIcon:after {
    font-family: "FontAwesome";
    content: "\e915";
}

any idea?