Public Ticket #2083110
lazy loading


  • PMoransais started the conversation


    I have read the documentation extensively but I did not find a way to lazzy load the slider images.

    The current behavior from the network tab of the developer tools on the latest version of the chrome browser if that every image in the slider is loaded before the animation starts.

    I use the slider as a slide show. Subsequent to loading all images, at each slide transition the slider loads (reloads ?) 2 images.

    I have read some discussions on your site about this but no solution was provided, saying instead that the initial load did not really load the images and is the expected behavior. it seems to me that all images are indeed loaded and that the animation does not start until after the last image is loaded.

    Am I missing something? 

    The behavior that I am looking for is for the animation to start at the earliest time!

    I would be grateful for you help on this

    Philippe Moransais

    (I added a link to my dev web site  https://dev.iBreeder.net - the slider loads automatically. It takes a little while). The web site is an Angular website. The slider code is itself lazzy loaded (custom code within angular logic) and then the slides HTML is injected in the page, including src url and the slider is initialized. At that point all images are loaded by the browser. The first slide is displayed after that. 

    I hope you guys like dogs!

  • [deleted] replied

    Hello Philippe,

    Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today.

    I would like to confirm that we have received your message. Due to the nature of the issue you are experiencing, I will have to contact and consult with the development team first. I will get back to you as soon as I can.

    We appreciate your patience while we're working towards your ticket.

  • [deleted] replied

    Thank you for your patience. 

    Since it's the jQuery version of LayerSlider and you write your own slider HTML code, you have complete freedom over this. Simply don't use src attributes on image elements, but instead use data-src. That way no additional images will be loaded, only the ones that the slider currently uses.

  • PMoransais replied

    Thank you Attila.

    Is this in your documentation? If so I missed it. Sorry.

    Philippe Moransais

  • [deleted] replied

    Thank you for the feedback, glad you could solve the problem. If you need further assistance please let us know.