Jump to content

Turn off lazy loading for the main image on my homepage

Recommended Posts

Posted (edited)

Hi, I noticed the main image on my homepage only loads after scrolling down. This makes my website at an initial glance look empty, which I don't like. 

I found out it's because of 'lazy loading', but I don't know how to change this in CSS (or better, squarespace's interface). Can someone help me with the code to turn off lazy loading for this specific image? 

This is the website: https://octagon-vuvuzela-9eam.squarespace.com/

This is what I tried so far (which did not work):

#block-884a04f5e7bf1fd4f702 .img {
    loading: eager !important; }

 

Edited by bitsst
Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

2 hours ago, tuanphan said:

Design > Site Styles > Animation > Choose None

image.png.7cb1d90a8e27138e6bc8bcc1cd73ef76.png

Hi Tuanphan! Thanks a lot for reaching out again, you're the best! 

Unfortunately Animations is already set to none, so I'm sure that's not it.. 

Link to comment

Try adding this to Design > Custom CSS
 

body.homepage .image-block {
    transform: unset !important;
    opacity: 1 !important;
    transition-delay: unset !important;
    transition: unset !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 2 weeks later...
On 5/10/2023 at 8:51 AM, tuanphan said:

Try adding this to Design > Custom CSS
 

body.homepage .image-block {
    transform: unset !important;
    opacity: 1 !important;
    transition-delay: unset !important;
    transition: unset !important;
}

 

I tried many things and now somehow it has been solved! Not really sure what did the trick. I'll save this for future reference! Thank you!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.