Hi, I have a number of elements that need to load at the same time. One is this wheel:

https://code.sololearn.com/WX6x1c56OFb5/#html

and the rest are animated gifs. They all need to work together, but at the moment they are out of sync, because they load at different times. Is there a way I can make them load all at the same time?

Thank you

You could hide the content initially, then use something like https://imagesloaded.desandro.com to fire a callback when the images have all successfully loaded. Inside the callback you can show the content again, a simple class toggle can do this.

I'm not sure what you're trying to do, but if it's along the lines of the above animation, I would consider making it less disorientating.

combine them all into one video with all the moving parts on the same 'canvas' easiest way to synch them,? or as one svg with many parts? (depends on whether you can represent the gif contents vai svg) 

I'm starting to think they maybe the best solution davep.

Thank you both