Discussion :

[Marc31]

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

[SpaceFrog]

regarde du coté de moments.js

[Marc31]

moment.js ??

[Doksuri]

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

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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);

[Marc31]

Merci pour le code!

Je viens de tester et la phrase s'affiche bien mais j'ai pas les heures, minutes et secondes.....

[Doksuri]

jsfiddle.net/cvs79b1g/ ca fonctionne bien pourtant... tu dois avoir un js qui est en erreur, verifies la console

[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 :

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)

[Doksuri]

il faut mettre le script apres le html

[Marc31]

Au top, merci ça marche!