0

I have a hero section in a website that has a background image with 2 images that overlay. These two images slide back to the sides like a curtain. My problem is the background image loads before the two overlay images. Is there any way I can force these 3 images to load in a set order?

TIA

Paul Atkinson
  • 1
  • Welcome to Stack Overflow! What code have you written already? Please have a read of [this guide on producing code for a good quality question](https://stackoverflow.com/help/minimal-reproducible-example), then include and mark up your code in your question. Cheers! – Bassem Jun 06 '20 at 23:56

1 Answers1

1

I don't think you can do this through pure HTML/CSS, but you can omit src attributes in your HTML and add them in with Javascript in whatever order you want when the page loads.

Check out this answer for more details. To set the background image you'll have to set the 'background-image' CSS property instead of setting the src attribute: Controlling image load order in HTML

Jasper Huang
  • 501
  • 2
  • 7
  • 15