Les animations

jdb-animate-type

Cliquez sur les boutons ci-dessous pour animer le ci-dessus

Les classes d'animation

Les classes jdb-animate-type permettent d'ajouter une animation lors de l'affichage de l'élément sur la page.

Toutes les animations ne s'animent qu'une seule fois, sauf jdb-animate-fading (clignotant) et jdb-spin (rotation) qui se répètent à l'infinie.

Code :

Copier Ouvrir dans JdBEdit

<div class="jdb-container">
  <span class="jdb-xl jdb-bold jdb-show-block">
    <i class="fa fa-fw fa-asterisk fa-4x jdb-animate-top" aria-hidden="true"></i>
  </span>
</div>

Animation des champs de texte

Le classe jdb-animate-input permet d'ajouter une animation d'agrandissement d'un champ de texte d'une largeur inférieure à 100% à une largeure de 100%.

Code :

Copier Ouvrir dans JdBEdit

<input type="text" class="jdb-input jdb-animate-input" style="width:70%">

Pour en savoir plus sur les formulaires JdB.CSS, veuillez consulter le chapitre sur les formulaires.