From 42038dd63bcd0270bed5dfa38671a8bc2ea8c0d3 Mon Sep 17 00:00:00 2001 From: imrozkhan205 Date: Mon, 16 Sep 2024 00:02:13 +0530 Subject: [PATCH] basics-js --- projects/guess-number/index.html | 12 +++++ projects/guess-number/script.js | 33 ++++++++++++++ projects/guess-number/styles.css | 0 projects/temperature-conversion/index.html | 28 ++++++++++++ projects/temperature-conversion/script.js | 21 +++++++++ projects/temperature-conversion/styles.css | 53 ++++++++++++++++++++++ 6 files changed, 147 insertions(+) create mode 100644 projects/guess-number/index.html create mode 100644 projects/guess-number/script.js create mode 100644 projects/guess-number/styles.css create mode 100644 projects/temperature-conversion/index.html create mode 100644 projects/temperature-conversion/script.js create mode 100644 projects/temperature-conversion/styles.css diff --git a/projects/guess-number/index.html b/projects/guess-number/index.html new file mode 100644 index 0000000..05a6e1f --- /dev/null +++ b/projects/guess-number/index.html @@ -0,0 +1,12 @@ + + + + + + Document + + + + + + \ No newline at end of file diff --git a/projects/guess-number/script.js b/projects/guess-number/script.js new file mode 100644 index 0000000..535a9f0 --- /dev/null +++ b/projects/guess-number/script.js @@ -0,0 +1,33 @@ +const minNum = 50; +const maxNum = 100; + +const answer = Math.floor(Math.random()*(maxNum-minNum+1))+minNum +// console.log(answer); + +let attempt = 0; +let guess; +let running = true; +while (running){ + guess = window.prompt(`Guess a number between ${minNum} and ${maxNum}`) + guess = Number(guess); + if(isNaN(guess)){ + window.alert("Please enter a valid number") + } + else if(guess maxNum){ + window.alert("Please enter a valid number"); + } + else{ + attempt ++; + if(guessanswer){ + window.alert("High!! Try again"); + } + else{ + window.alert(`Correct the answer was ${answer} and it took you ${attempt}`) + running = false; + } + } + +} \ No newline at end of file diff --git a/projects/guess-number/styles.css b/projects/guess-number/styles.css new file mode 100644 index 0000000..e69de29 diff --git a/projects/temperature-conversion/index.html b/projects/temperature-conversion/index.html new file mode 100644 index 0000000..178541c --- /dev/null +++ b/projects/temperature-conversion/index.html @@ -0,0 +1,28 @@ + + + + + + + Temperature conversion + + + + + + + \ No newline at end of file diff --git a/projects/temperature-conversion/script.js b/projects/temperature-conversion/script.js new file mode 100644 index 0000000..607c7f6 --- /dev/null +++ b/projects/temperature-conversion/script.js @@ -0,0 +1,21 @@ +const textBox = document.getElementById("textBox"); +const toFahrenheit = document.getElementById("toFahrenheit"); +const toCelcius = document.getElementById("toCelcius"); +const result = document.getElementById("result"); +let temp; + +function convert(){ + if(toFahrenheit.checked){ + temp = Number(textBox.value); + temp = temp * 9 / 5 + 32; + result.textContent = temp.toFixed(1)+ "F" + } + else if(toCelcius.checked){ + temp = Number(textBox.value); + temp = (temp-32) * (5/9); + result.textContent = temp.toFixed(1)+ "C" + } + else{ + result.textContent = "Select a unit"; + } +} \ No newline at end of file diff --git a/projects/temperature-conversion/styles.css b/projects/temperature-conversion/styles.css new file mode 100644 index 0000000..d18da57 --- /dev/null +++ b/projects/temperature-conversion/styles.css @@ -0,0 +1,53 @@ +body{ + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + background: linear-gradient(to left, lightblue, lightpink, lightgreen ); + margin-top: 50px; + +} +h1{ + color: black; +} +form{ + box-shadow: 0px 10px 10px 6px rgb(74, 71, 71); + text-align: center; + max-width: 300px; + margin: auto; + padding: 25px; +} +#textBox{ + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + font-weight: bold; + height: 30px; + width: 100px; + text-align: center; + font-size: 2em; + border: 1.5px solid rgb(113, 108, 108); + margin-bottom: 20px; + color: rgb(82, 80, 80); + border-radius: 10px; +} +.radio{ + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + font-size: 15px; + font-weight: bold; + padding: .2rem; +} +button{ + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + padding: 0.4rem; + margin-top: 15px; + font-weight: bold; + border-radius: 10px; + border-color: rgb(160, 152, 152); + border-width: 1px; +} +button:hover{ + background-color: rgb(206, 206, 205); + transition: 0.2s ease; +} +#result{ + color: black; + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + font-weight: bold; + font-size: 20px; +} \ No newline at end of file pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy