interactive-tutorials/animations-demo/script.js at ffd17129b802acfd2aa4f5d59e9e5289c3546ba6 · bit-by-bit-coding/interactive-tutorials · 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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
var id = null;
function e1Example() {
  var elem = document.getElementById("e1Bot");
  var pos = 0;
  clearInterval(id);
  id = setInterval(frame, 10);
  function frame() {
    if (pos == 300) {
      clearInterval(id);
    } else {
      pos++;
      elem.style.left = pos + 'px';
    }
  }
}

function e2Example() {
    var elem = document.getElementById("e2Bot");
    var delay = document.getElementById("e2DelayValue");
    setTimeout(e2, delay.value*1000);
}

function e2() {
    var elem = document.getElementById("e2Bot");
    var opacity = 0;
    clearInterval(id);
    id = setInterval(frames, 100);
    function frames() {
        if (opacity == 1) {
            clearInterval(id);
        }
        else {
            opacity+=0.1;
            elem.style.opacity = opacity;
        }
    }
    setTimeout(e2Finish, 1000)
}

function e2Finish() {
    var elem = document.getElementById("e2Bot");
    elem.style.opacity = 0;
}