Почему скрытые элементы подгружаются в момент их появления, а не в момент загрузки сайта?
потому что браузер экономит трафик и время и не грузит то что он все равно не будет показывать. 
Можно принудительно загрузить эти картинки через JS - гуглите "js image preload".
либо скрыть блоки другим способом кроме display:none, с которым браузер их загрузит заранее.
так же может помочь <link rel="preload" href="урлнакартинкутут" as="image">, но это не точно
потому что браузер экономит трафик и время и не грузит то что он все равно не будет показывать. 
Можно принудительно загрузить эти картинки через JS - гуглите "js image preload".
либо скрыть блоки другим способом кроме display:none, с которым браузер их загрузит заранее.
так же может помочь <link rel="preload" href="урлнакартинкутут" as="image">, но это не точно