diff --git a/index.html b/index.html new file mode 100644 index 0000000..a13ad16 --- /dev/null +++ b/index.html @@ -0,0 +1,23 @@ + + + + + + Stopwatch -using Javascript + + + + +
+

00:00:00

+
+ + + +
+
+ + + + + \ No newline at end of file diff --git a/pngtree-refresh-ccw-flat-white-color-icon-ccw-rotate-reset-vector-png-image_19938782-removebg-preview.png b/pngtree-refresh-ccw-flat-white-color-icon-ccw-rotate-reset-vector-png-image_19938782-removebg-preview.png new file mode 100644 index 0000000..dd37cea Binary files /dev/null and b/pngtree-refresh-ccw-flat-white-color-icon-ccw-rotate-reset-vector-png-image_19938782-removebg-preview.png differ diff --git a/script.js b/script.js new file mode 100644 index 0000000..53620e0 --- /dev/null +++ b/script.js @@ -0,0 +1,37 @@ + +let [seconds,minutes,hours] = [0,0,0]; +let displayItem = document.getElementById("displayItem"); +let timer = null; + +function stopwatch() { +seconds++; +if (seconds == 60) { + seconds = 0; + minutes++; + if (minutes == 60) { + minutes = 0; + hours++; + } +} + +let h = hours < 10 ? "0" + hours :hours; +let m = minutes < 10 ? "0" + minutes : minutes; +let s = seconds < 10 ? "0" + seconds : seconds + + +displayItem.innerHTML = h+ ":" + m + ":" + s; +} +function watchStart() { +if(timer!== null){ + clearInterval(timer); +} +timer = setInterval(stopwatch,1000); +} +function watchStop() { +clearInterval(timer); +} +function watchReset() { +clearInterval(timer); +let [seconds,minutes,hours] = [0,0,0]; +displayItem.innerHTML = "00:00:00" +} \ No newline at end of file diff --git a/stop_white_button_icon_227857-removebg-preview.png b/stop_white_button_icon_227857-removebg-preview.png new file mode 100644 index 0000000..9bb6229 Binary files /dev/null and b/stop_white_button_icon_227857-removebg-preview.png differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..715498d --- /dev/null +++ b/style.css @@ -0,0 +1,40 @@ +*{ + padding: 0; + box-sizing: border-box; + margin: 0; +} +body{ + background: #222; + color: white; +} +.stopwatch{ + width: 90%; + max-width: 600px; + background-color: #323741; + text-align: center; + padding: 40px 0 ; + color: #fff; + margin: 200px auto 0; + box-shadow: 0 10px 10px rgba(0,0,0,0.8); +} +.stopwatch h1{ + margin-top: 60px; + font-size: 64px; + padding: 15px; + margin-top: -1rem; + margin: 35px; + font-weight: 300; +} +.buttons{ + display: flex; + align-items: center; + justify-content: center; +} +.buttons .start{ + width: 80px; +} +.buttons img { + width: 40px; + margin: 0 20px ; + cursor: pointer; +} \ No newline at end of file diff --git a/white-play-button-icon-on-transparent-background-flat-style-white-play-button-icon-for-your-web-site-design-logo-app-ui-play-symbol-2M0MWX5-removebg-preview.png b/white-play-button-icon-on-transparent-background-flat-style-white-play-button-icon-for-your-web-site-design-logo-app-ui-play-symbol-2M0MWX5-removebg-preview.png new file mode 100644 index 0000000..ac5f42f Binary files /dev/null and b/white-play-button-icon-on-transparent-background-flat-style-white-play-button-icon-for-your-web-site-design-logo-app-ui-play-symbol-2M0MWX5-removebg-preview.png differ