Aaron98990.github.io/developer.html at main · Aaron98990/Aaron98990.github.io · 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
44
45
46
47
48
49
50
51
52
53
<!DOCTYPE html>
<html>
    <head>
        <title>Classic Screensaver in JS</title>
    </head>
    <body>
        <script type="text/javascript">
            var ball = document.createElement("img");
            document.body.appendChild(ball);
            ball.src = "../images/ball.png";
            ball.style.width = "80px";
            ball.style.left = "0px";
            ball.style.top = "0px"

            ball.style.position = "absolute"

            var boundX = window.innerWidth;
            var boundY = window.innerHeight;

            var speed = 10;
            var x=1;
            var y=1;
            var diff=20;

            function screensaver() {
                var leftV = ball.style.left
                var left = parseInt(leftV.substring(0, leftV.length-2))

                var topV = ball.style.top
                var top = parseInt(topV.substring(0, topV.length-2))


                if(80 + diff + left > boundX || left < 0){
                    console.log("XALERT")
                    x *= -1;
                }

                if (85 + diff + top  > boundY || top < 0){
                    console.log("YALERT")
                    y *= -1;
                }
                ball.style.left = left + (x*diff) + 'px';
                ball.style.top = top + (y*diff) + 'px';
                console.log(ball.style.left, ball.x, boundX, ball.style.top, ball.y, boundY)

                setTimeout(screensaver, 25)
            }

            screensaver()

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