Décompte Date Anniversaire

Version imprimable

16/02/2023, 09h29
Marc31

Décompte Date Anniversaire

Bonjour à tous,

Je cherche à faire sur un site web, un décompte jusqu'a une date d'anniversaire en javascript avec les heures, minutes et secondes.

Quelqu'un aurez un bout de code, svp ?

Merci et Bonne journée
16/02/2023, 10h06
SpaceFrog

regarde du coté de moments.js
16/02/2023, 10h20
Marc31

Décompte Date Anniversaire

moment.js ??

roh SpaceFrog telecharger une lib pour 3 lignes de calculs ...

Code:

il reste <span id="days"></span>jours, <span id="hours"></span>heures, <span id="minutes"></span> et <span id="seconds"></span>secondes avant l'anniversaire

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
const birthday = new Date('2023-02-27T16:30:00');
 
$days = document.getElementById('days');
$hours = document.getElementById('hours');
$minutes = document.getElementById('minutes');
$seconds = document.getElementById('seconds');
 
function calcTimeLeft() {
    const now = new Date();
    let diff = birthday.getTime() - now.getTime();
    $days.textContent = Math.floor(diff / (1000 * 60 * 60 * 24));
 
    now.setTime(now.getTime() + Math.floor(diff / (1000 * 60 * 60 * 24)) * (1000 * 60 * 60 * 24));
    diff = birthday.getTime() - now.getTime();
    $hours.textContent = Math.floor(diff / (1000 * 60 * 60));
 
    now.setTime(now.getTime() + Math.floor(diff / (1000 * 60 * 60)) * (1000 * 60 * 60));
    diff = birthday.getTime() - now.getTime();
    $minutes.textContent = Math.ceil(diff / (1000 * 60));
 
    now.setTime(now.getTime() + Math.floor(diff / (1000 * 60)) * (1000 * 60));
    diff = birthday.getTime() - now.getTime();
    $seconds.textContent = Math.ceil(diff / (1000));
}
 
setInterval(calcTimeLeft, 1E3);

16/02/2023, 11h24
Marc31

Décompte Date Anniversaire

Merci pour le code!

Je viens de tester et la phrase s'affiche bien mais j'ai pas les heures, minutes et secondes.....
16/02/2023, 11h40
Doksuri

jsfiddle.net/cvs79b1g/ ca fonctionne bien pourtant... tu dois avoir un js qui est en erreur, verifies la console
16/02/2023, 12h03
Marc31

J'ai rajouté <script type="text/javascript">et j'ai mis le code dans la balise head....

Il me marque ça dans la console :

Citation:

Failed to load resource: net::ERR_NAME_NOT_RESOLVED

ad_status.js:1 Failed to load resource: net::ERR_NAME_NOT_RESOLVED

4test2.php:57 Uncaught TypeError: Cannot set properties of null (setting 'textContent')

at calcTimeLeft (test2.php:57:26)

19test2.php:57 Uncaught TypeError: Cannot set properties of null (setting 'textContent')

at calcTimeLeft (test2.php:57:26)
16/02/2023, 12h46
Doksuri

il faut mettre le script apres le html
16/02/2023, 13h53
Marc31

Décompte Date Anniversaire

Au top, merci ça marche!