• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Marek
  • Private: No
  • Open Date: 06.09.19, 09:32
  • Opened by: Walter Fontana
  • Closed by: Marek
  • Closed on: 11.09.19, 10:07
  • Reason: Closed
  • Comment: Glad to help!

Ticket #15503 - Lazy Loaing problem in mobile

I noticed that on the mobile site, for example on the homepage, the carousel only loads the first two images. if I swipe left or right, the other images are not loaded. To load them I have to scroll down the page. If I use arrows instead this doesn’t happen. I think it’s a lazy loading bug. Is it possible to solve this problem? or remove the lazy loading ONLY in mobile in the carousel?
I tested the problem on 3 devices.
I add a link with a video to explain better that problem.
https://photos.app.goo.gl/Wtkaf1GGjGg3dALU9

Comments

Marek 06 Sep 2019, 18:53

Hi, Walter.
I’m not able to reproduce the issue. I have make a test on iPhone and Android devices and an image automatically loading on carousel scroll. Here is a screencast from my device https://www.dropbox.com/s/1hot4flxtpw2lxf/rpreplay_final1567788619.mp4?dl=0

Walter Fontana 09 Sep 2019, 09:15

Yes, but you use the arrows. Try to swipe left with your finger like me in my video.
If i use arrows i have no problem!

Marek 09 Sep 2019, 10:37

The issue has been fixed. Please test to confirm the change

Walter Fontana 10 Sep 2019, 09:14

Yes, it’s ok.
Can you tell me what change was made? because I have the same problem with another site (www.timbriveloci.it) that I created with your theme and I should make this change also on that one.

Marek 10 Sep 2019, 12:07

Fixed file is /themes/alysum/assets/js/alysum.js

Walter Fontana 10 Sep 2019, 12:22

On timbriveloci.it I don’t have that file, maybe because it’s a previous version (but I can’t update it for the moment). How can I do?

Marek 10 Sep 2019, 12:31

open the file theme.js
find the function:

function onChange() {
  var currentThis = this;
  if (params.loop == 0) {
    updateArrowsState(currentThis);
  }
}

replace with

function onChange() {
          var currentThis = this;
          if (params.loop == 0) {
            updateArrowsState(currentThis);
          }
          
          if (theme_cfg.gs_lazy_load == 1) {
            var bLazy = new Blazy();
            bLazy.revalidate();
          }
}
Walter Fontana 10 Sep 2019, 12:42

I do that. But i have the same problem (on timbriveloci.it)

Marek 10 Sep 2019, 15:42

But it works for the first store. Make sure the cache is disabled

Walter Fontana 11 Sep 2019, 09:48

Ok, sorry…the cache… Now it works