1 pièce(s) jointe(s)
Convertir des chiffres en compteur countdoun
bonjour, je suis entrain de créer un site web. et j'ai créer un canevas de chiffre que j'aimerais animé pour en faire un compteur d'évènement .
voici le code HTML de la partie du site. vous trouverez ci-joint l'image de la partie en question.
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
| <section class="divider parallax " data-stellar-background-ratio="0.5" data-bg-img="images/bg1.JPG">
<div class="container pt-90 pb-90">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-4">
<h3 class="line-bottom" style="font-size: 35px; color: rgb(245, 245, 245);">Notre prochaine table ronde est dans</h3>
</div>
<div class="col-xs-12 col-sm-6 col-md-2 mb-md-50" >
<div class="funfact style-1 pb-15 pt-15 p-20 bg-per" >
<h2 class="animate-number text-theme-blx mt-0 font-48 " data-value="25" data-animation-duration="2000" > 0</h2>
<div class="clearfix"></div>
<h4 class="text-uppercase font-19 align-center">Jours</h4>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-2 mb-md-50">
<div class="funfact style-1 pb-15 pt-15 p-20 bg-per" style="text-align: center;">
<h2 class="animate-number text-theme-blx mt-0 font-48" data-value="10" data-animation-duration="2500">0</h2>
<div class="clearfix"></div>
<h4 class="text-uppercase font-19">Heures</h4>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-2 mb-md-50">
<div class="funfact style-1 pb-15 pt-15 p-20 bg-per" style="text-align: center;">
<h2 class="animate-number text-theme-blx mt-0 font-48" data-value="20" data-animation-duration="3000">0</h2>
<div class="clearfix"></div>
<h4 class="text-uppercase font-19">Minutes</h4>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-2 mb-md-50">
<div class="funfact style-1 pb-15 pt-15 p-20 bg-per" style="text-align: center;">
<h2 class="animate-number text-theme-blx mt-0 font-48" data-value="30" data-animation-duration="2500">0</h2>
<div class="clearfix"></div>
<h4 class="text-uppercase font-19">Secondes</h4>
</div>
</div>
</div>
</div>
</section> |
si vous savez comment je peux le faire je reste a l’écoute. Merci d'avance pour votre contribution.
Pièce jointe 473264