DynamicSlider/index.html at master · Lanatel/DynamicSlider · GitHub

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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Test Site</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  </head>
  <body>

    <div style="width: 600px; margin: 20px auto; text-align: center;">
        <h3 id="slider-value"></h3>
        <div id="slider"></div>
    </div>

    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script>

      (function getNumber(){
        $.get('/get-number', function(response) {
            $( "#slider-value" ).text(response.number);
            $( "#slider" ).slider({value: response.number});
        });
        setTimeout(getNumber, 2000);
      })();

    </script>
  </body>
</html>