Hubspot Image Slider module not loading on pageload

[subin]

Hi all

I have used Hubspot Default image slider module for my website banner. But it seems that when you refresh the page, there is a 0.5 second delay, showing the slider later than the rest of the page.

See here, and make sure to try and refresh the page:

https://goo.gl/SiJa2E

Can anyone advice me to load the the slider with out any delay? 

Thanks

[workrails]

Hi, 

I am experiencing the same problem and the css snipet provided as the answer is not working for me. When I go to your site now it seems you fixed it. What was the best solution you found?

[stefen · Accepted solution]

The reason is because the slider script is waiting until all the images load before displaying them. I think a better solution would be to display the first image so that the page doesn't have to reflow later on. Try adding this CSS to your stylesheet to fix the issue:

.hs_cos_flex-slides > li:first-child {
    display: block;
}

[luiscosio]

Whenever the slider changes, there is a small delay until the image loads. Is there any way to preload all slider images?

You can see it in action here:

https://www.inbest.me/

There is a small delay on the first slider (even with the CSS code provided) and subsequent slides take a bit to load as well. 

[stefen]

@luiscosio it's lazy loading the images. Unfortanately, I don't think there is a way to override the hubspot module in that way - you'd have to make your own custom module to control it.

[subin]

Thanks for your reply @stefen, the css works well for me

Thanks