Lazy load carousel first image not loaded

[thewebartisan7]

As per doc I am using data-lazy-src for lazy load images:

<div id="myCarousel" class="carousel">
  <div class="carousel__slide">
    <img data-lazy-src="https://lipsum.app/id/1/1200x675" />
  </div>
  <div class="carousel__slide">
    <img data-lazy-src="https://lipsum.app/id/2/1200x675" />
  </div>
</div>

However, first image it's not correctly loaded, see here:
https://new.uovodiluc.ch/galleria.html?lazy-all

For now I have solved by not lazy loading first image, then it works:
https://new.uovodiluc.ch/galleria.html

But I didn't see anything in docs about this.

The strange thing is that works fine here https://new.uovodiluc.ch/ but the initialization code and markup it's the same.

Did I missing something?

Thanks

[fancyapps]

Hi,

Are you sure you are using the latest version? As you can see here - https://fancyapps.com/playground/vt - it works fine.

btw, you can safely update to v4.0.X, because this project follows SemVer (https://semver.org/).

[thewebartisan7]

In my package.json I have:

 "@fancyapps/ui": "^4.0.16",

Then I am importing like:

import { Fancybox, Carousel } from "@fancyapps/ui";

Checking compiled file, I can see below line in the source code:

b.version="4.0.16"

See here https://new.uovodiluc.ch/js/app.js

I suppose this line of code is coming from fancybox.

[fancyapps]

But, right now, the latest version is 4.0.19

btw, if you are using VSCode, then I recommend using https://marketplace.visualstudio.com/items?itemName=pflannery.vscode-versionlens extension to easily check and update everything inside package.json

[thewebartisan7]

Perfect, thanks! By upgrading to 4.0.19 everything works fine https://new.uovodiluc.ch/galleria.html

I am not using VSCode, but PHPStorm.