Pubblicato da: Max
In data:
12 Mar 2022
Tempo di lettura:
Ciao! Nel video di oggi, vedremo come realizzare un
Effetto sipario in css
al momento dello scroll della pagina.
Partiamo impostando la struttura di base del nostro progetto
Creiamo in html un div con classe cover, passiamo al css e inseriamo una dichiarazione di stile con selettore di classe cover, e inseriamo tutte le dichiarazioni che ci occorrono.
Inseriamo all’interno del div con classe cover, un div con classe img, che sarà il contenitore della nostra immagine cover che caricheremo in css, grazie alla proprietà background-image.
Dopo la chiusura del div con classe cover, inseriamo un div con classe sipario, passiamo al css, e stilizziamolo. Questo sarà il box che conterrà l’immagine che allo scroll, si sovrapporrà alla prima, ottenendo l’effetto desiderato.
Abbiamo concluso questo breve video-tutorial, spero che possa esserti di ispirazione per i tuoi futuri lavori.
Per scaricare i file utilizzati, clicca sul tasto Download, e dopo decomprimi mil file ZIP.
Puoi guardare il video-tutorial completo, sul mio canale YouTube!
Ciao! Alla prossima 🙂
