Ciao a tutti, avrei bisogno del vostro supporto.
Nella home page del sito che sto ultimando ho delle slide (3 immagini in tutto, con relativo testo animato con CSS per ognuna di esse) che si alternano in loop infinito, con dissolvenza incrociata al passaggio dall'una all'altra.
Sotto questa slide, nel resto della pagina, ci sono diverse altre immagini, che inizialmente sono fuori dallo schermo.
Ora, quando la connessione è veloce, sostanzialmente non si pongono problemi.
Mi piacerebbe tuttavia far si che le sembianze iniziali della pagina non siano alterate durante il caricamento, in caso di connessione particolarmente lenta.
Ho provato ad attivare il lazy loading, mi mette le immagini delle slide in priorità alta (e questo va bene), ma di fatto non risolve il problema.
Ciò che accade infatti è che prima viene visualizzata la struttura del sito, con le slide non sovrapposte ma affiancate verticalmente, in quanto evidentemente non ancora organizzate dal JS.
Inizia lo slide del testo in css e solo dopo (o durante) questa fase, cominciano a caricarsi le immagini, poco alla volta.
Ovviamente stiamo parlando della simulazione di una connessione particolarmente lenta con il devtool di chrome.
Ho eseguito lo stesso test su un sito che ha delle slide con testo animato simili alle mie, questo:
https://www.kmm.com/
Ho visto che qui, a differenza del mio sito, non viene visualizzato niente durante il caricamento, ma appare tutto in una volta.
Come si fa ad implementare qualcosa di simile?
Grazie per il supporto!
PS: Preciso una cosa: non voglio che TUTTA la pagina sia caricata quando è completa, ma SOLO le slide.