Bonjour à tous,
Je vous explique, je suis en train de mettre en place un timer grâce au javascript Flipclock avec la possibilité de le paramétrer/contrôler sur une page admin ici tournoiAdmin.html et je souhaite ensuite l'afficher sur la page tournoi.html. Cependant même avec une fonction load, le timer n'est pas bien chargé sur la page tournoi et n'est pas dynamique...

Voici la page tournoiAdmin :

Code html : 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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 <div name="minuteur" id="minuteur" class="w3-display-bottomright w3-quarter w3-center w3-container w3-content w3-blue" style="height: 500px;margin-right: 80px; padding-bottom:80px;">
        <h1 class="w3-border" style="margin-bottom: 50px"> TIMER </h1>
        <div class="clock" id="clock" style="margin:2em;"></div>
        <p> Entrez un timer en minutes : </p>
        <input class="timer" type="number" id="timer" min="1" max="99" step="1"/></br></br>
        <button class="start w3-green w3-btn"> Start </button>
        <button class="stop w3-red w3-btn"> Stop </button></br></br>
        <button class="reset w3-amber w3-btn"> Set/Reset </button></br>
    </div> 
<script type="text/javascript" id="script1">
    var clock;
    var clock2;
    $(document).ready(function() {
        clock = $('.clock').FlipClock(60, {
            clockFace: 'MinuteCounter',
            countdown: true,
            autoStart: false,
            language:"french",
            callbacks: {
                start: function() {
                    $('.message').html('The clock has started!');
                },
                stop: function() {
                    $('.message').html('The clock has stopped!');
                },
                reset: function() {
                    $('.message').html('The clock has been set!');
                }
            }
        });
        $('.start').click(function(e) {
            clock.start();
        });
        $('.stop').click(function(e) {
            clock.stop();
        });
        $('.reset').click(function(e) {
            clock.stop();
            clock.reset();
            clock.setTime(document.getElementById("timer").value*60);
        });
    });
</script>

Et ici la page tournoi :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
<div class="w3-display-middle w3-content w3-container w3-white">
<div class="clock" id="clock2">
</div>
</div> <script>
    $('#clock2').load( "tournoiadmin" );
</script>


Est ce que quelqu'un aurait une idée pour résoudre mon problème ? Merci de vos réponses !