diff --git a/Rushiraj Parekh/Mini Project.pdf b/Rushiraj Parekh/Mini Project.pdf new file mode 100644 index 0000000..f8b64b2 Binary files /dev/null and b/Rushiraj Parekh/Mini Project.pdf differ diff --git a/Rushiraj Parekh/Output_Screenshot.png b/Rushiraj Parekh/Output_Screenshot.png new file mode 100644 index 0000000..d359e5d Binary files /dev/null and b/Rushiraj Parekh/Output_Screenshot.png differ diff --git a/Rushiraj Parekh/clock.html b/Rushiraj Parekh/clock.html new file mode 100644 index 0000000..270ffd1 --- /dev/null +++ b/Rushiraj Parekh/clock.html @@ -0,0 +1,37 @@ + + + + Clock + + + + + +
+ +
+
+
+
+
+ + \ No newline at end of file diff --git a/Rushiraj Parekh/css/clock.css b/Rushiraj Parekh/css/clock.css new file mode 100644 index 0000000..0cac573 --- /dev/null +++ b/Rushiraj Parekh/css/clock.css @@ -0,0 +1,62 @@ +*{ + margin: 0; + padding: 0; +} + +#a { + text-align: center; + margin: 20px 400px; + font-size: 100px; + color: rgb(3, 82, 34); + border: 6px solid rgb(56, 34, 2); + border-top-right-radius: 50px; + border-bottom-left-radius: 50px; + background-image: linear-gradient(rgb(141, 14, 14), rgb(190, 230, 17), rgb(110, 5, 5)); + font-family: monospace; +} + +body { + background-image: linear-gradient(black, blue,black, blue, black); + height: 100%; +} + +#clock-image{ + background-image: url('../img/clock.jpeg'); + background-size: contain; + background-repeat: no-repeat; + background-position: center; + height: 700px; + width: 700px; + margin-left: 400px; + position: relative; +} + +.hand{ + position: absolute; + left: 340px; + bottom: 350px; + z-index: 10; + transform-origin: bottom; +} + +.min{ + background-color: black; + width: 10px; + height: 270px; + border-radius: 50px; +} + +.hour{ + background-color: black; + width: 10px; + height: 150px; + border-radius: 50px; +} + +.sec{ + background-color: red; + width: 5px; + height: 300px; + left: 343px; + border-radius: 50px; +} \ No newline at end of file diff --git a/Rushiraj Parekh/img/clock.jpeg b/Rushiraj Parekh/img/clock.jpeg new file mode 100644 index 0000000..c9cca1c Binary files /dev/null and b/Rushiraj Parekh/img/clock.jpeg differ diff --git a/Rushiraj Parekh/js/clock.js b/Rushiraj Parekh/js/clock.js new file mode 100644 index 0000000..7c615a5 --- /dev/null +++ b/Rushiraj Parekh/js/clock.js @@ -0,0 +1,26 @@ +const secHand = document.getElementsByClassName('sec'); +const minHand = document.getElementsByClassName('min'); +const hourHand = document.getElementsByClassName('hour'); + + + +function setClock(){ + //alert("Done"); + let date = new Date(); + let secRatio = date.getSeconds() / 60; + let minRatio = (secRatio + date.getMinutes()) / 60; + let hrRatio = (minRatio + date.getHours()) / 12; + + setRotation(secHand, secRatio); + setRotation(minHand, minRatio); + setRotation(hourHand, hrRatio); +} + +function setRotation(element, value){ + $(()=>{ + $(element).css('transform',`rotate(${value * 360}deg)`); + }); +} + +setClock(); +window.setInterval(setClock, 100); \ No newline at end of file