Lightbox is missing thumbnails for lazy-loading images

Steffen

Well-known member
Affected version
2.3.7
The Lightbox doesn't show thumbnails for images that have not yet been (lazy-)loaded. This is because XenForo sets the data-fancybox attribute (which Fancybox uses to group images into a gallery) only after an image has been loaded (see the XF.Lightbox.imageChecked function). In longer posts (and maybe for slow internet connections in general) this is too late.

In the following example there are two images at the top and two at the bottom. In between there is a lot of text (or alternatively more images). The two images at the top are loaded early (because they are in the viewport) and therefore usually load before the user can click them to open the Lightbox. But the two images at the bottom are only loaded when the user scrolls and they come close to the viewport which means that they initially lack the data-fancybox attribute and are therefore not part of the gallery.

How to reproduce:
1. Go to https://xenforo.com/community/threads/lightbox-thumbnails-vs-lazy-loading-test.232678/
2. Click the first image to open the Lightbox

What should happen:
- The lightbox should show 4 thumbnails because there are 4 images in the post

What actually happens:
- The lightbox shows only 2 thumbnails
 
Back
Top Bottom