Un loader de type … en full CSS

Le chargement sur Mac comme le Instapaper iOS Saving Overlay nous a inspiré pour développer une solution en full css et sans images.
Vous pourrez voir le démo sur le CodePen qu’on a créé, à part la simplicité le chargement de la page pourra en tirer parti aussi.

Permettez-moi de vous expliquer comment cela fonctionne. D’abord voyons le HTML:

Le HTML

Chaque point sera enveloppé dans une balise span et tout cela sera englobé dans un paragraphe avec la classe .saving.

Pour que la magie opère, nous aurons besoin d’un peu de CSS

Le CSS

C’est un code assez minimaliste mais suffisant pour lancer l’animation, on n’a pas mis de styles visuels personnalisé pour le formatage du texte donc libre à vous de le décorer à votre guise.

Une réponse à “Un loader de type … en full CSS”

  1. Michel

    merci beaucoup, ça m’a tellement aidé!
    tellement content :)

    Répondre

Répondre