Maken van een Pi thema laden scherm (5 / 7 stap)

Stap 5: Het toevoegen van de animaties

Nu dat de lay-out klaar is, zullen we de tekst, de afbeelding en het scherm zelf animeren. Laten we beginnen met de tekst. We hebben om het om te scrollen over het scherm te krijgen. Dit kan gedaan worden met behulp van de tag van het selectiekader . Vervanging van de p -tag met de tag selectiekader en voor CSS, vervangen van de p -selector met de selector van het selectiekader .

Dus, in plaats van

 <p>DIGITS OF PI HERE</p> 

gebruik

 <marquee scrollamount=30>DIGITS OF PI HERE</marquee> 

Het scrollamount-kenmerk definieert de snelheid waarmee de tekst wordt verschoven. Hoe hoger de waarde, des te sneller de scroll.

Voor CSS, in plaats van

 p { Declarations } 

gebruik

 marquee { Declarations }