JS exercises done

Stef-Lev · Stef-Lev · commit faad510a76bd · 2020-02-05T19:19:53.000+02:00
diff --git a/Week1/Homework/js-exercises/aboutMe/aboutMe.js b/Week1/Homework/js-exercises/aboutMe/aboutMe.js
@@ -1,9 +1,15 @@
+//Changing Font
 document.body.style.fontFamily = "Arial,sans-serif";
+//Adding personal info
 document.querySelector("#nickname").innerHTML = "Stef";
 document.querySelector("#fav-food").innerHTML = "Pastitsio";
 document.querySelector("#hometown").innerHTML = "New Philadelphia";
-
+//Adding class in each li inside the ul
 let listItem = document.getElementsByTagName("li");
 for (let i = 0; i < listItem.length; i++) {
     listItem[i].className = "list-item"
-}
+}
+//Adding Photo
+let myPhoto = document.createElement("img");
+myPhoto.src = "https://media-exp1.licdn.com/dms/image/C5603AQH-4xn8lqwm_A/profile-displayphoto-shrink_200_200/0?e=1586390400&v=beta&t=cdHKfe_B5JDWPC76dV4BqGO1uUhKCzQk6ISv99lTYcY";
+document.body.appendChild(myPhoto);
diff --git a/Week1/Homework/js-exercises/catWalk/cat.html b/Week1/Homework/js-exercises/catWalk/cat.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8" />
+    <title>Cat Walk</title>
+</head>
+
+<body>
+    <img style="position:absolute;" src="http://www.anniemation.com/clip_art/images/cat-walk.gif" />
+    <script src="catWalk.js"></script>
+</body>
+
+</html>
diff --git a/Week1/Homework/js-exercises/catWalk/catWalk.js b/Week1/Homework/js-exercises/catWalk/catWalk.js
@@ -0,0 +1,19 @@
+'use strict'
+let catImage = document.querySelector("img");
+let positionNum = 10
+let positionStyle = catImage.style.left = positionNum + "px";
+let screenWidth = window.innerWidth;
+
+setInterval(function () {
+    positionNum += 10;
+    catImage.style.left = positionNum + "px";
+    if (positionNum === screenWidth / 2) {
+        catImage.src = "https://media1.tenor.com/images/2de63e950fb254920054f9bd081e8157/tenor.gif?itemid=10561424";
+    }
+    else if (positionNum === screenWidth) {
+        positionNum = 10;
+        catImage.src = "http://www.anniemation.com/clip_art/images/cat-walk.gif"
+    }
+
+}, 60)
+
diff --git a/Week1/Homework/js-exercises/logoHijack.js b/Week1/Homework/js-exercises/logoHijack.js
@@ -0,0 +1,7 @@
+"use strict"
+function hijackGoogleLogo() {
+    let oldLogo = document.getElementById("hplogo");
+    oldLogo.src = "https://www.hackyourfuture.dk/static/logo-dark.svg";
+    oldLogo.srcset = "https://www.hackyourfuture.dk/static/logo-dark.svg";
+}
+hijackGoogleLogo();
diff --git a/Week1/Homework/js-exercises/whatsTheTime/showCurrentTime.js b/Week1/Homework/js-exercises/whatsTheTime/showCurrentTime.js
@@ -0,0 +1,19 @@
+"use strict"
+//Create an h1 that contains the time
+let h1 = document.createElement("h1");
+h1.style.fontSize = ("5rem");
+h1.style.textAlign = ("center");
+document.body.appendChild(h1);
+
+//Function to show the current time
+function currentTime() {
+    setInterval(function () {
+        let today = new Date();
+        let time = `${today.getHours()}:${today.getMinutes()}:${today.getSeconds()}`;
+        h1.innerHTML = time;
+    }, 1000);
+}
+//Function onload
+h1.onload = currentTime();
+
+
diff --git a/Week1/Homework/js-exercises/whatsTheTime/time.html b/Week1/Homework/js-exercises/whatsTheTime/time.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+
+<head>
+    <title>Current time</title>
+</head>
+
+<body>
+    <script src="showCurrentTime.js"></script>
+</body>
+
+</html>
