Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

basics-js#45

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Open
imrozkhan205 wants to merge1 commit intosahandghavidel:main
base:main
Choose a base branch
Loading
fromimrozkhan205:basic-js
Open
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletionsprojects/guess-number/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="script.js"defer ></script>
</head>
<body>

</body>
</html>
33 changes: 33 additions & 0 deletionsprojects/guess-number/script.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -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<minNum || guess > maxNum){
window.alert("Please enter a valid number");
}
else{
attempt ++;
if(guess<answer){
window.alert("Low!! Try again");
}
else if (guess>answer){
window.alert("High!! Try again");
}
else{
window.alert(`Correct the answer was ${answer} and it took you ${attempt}`)
running = false;
}
}

}
View file
Open in desktop
Empty file.
28 changes: 28 additions & 0 deletionsprojects/temperature-conversion/index.html
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>Temperature conversion</title>
</head>
<body>
<form>
<h1>
Temperature conversion
</h1>
<input type="number" id="textBox" value="0"><br>
<div class="radio">
<input type="radio" id="toFahrenheit" name="unit">
<label for="toFahrenheit" >Celcius --> Fahrenheit</label></br>

<input type="radio" id="toCelcius" name="unit">
<label for="toCelcius" >Fahrenheit --> Celcius</label><br>
</div>
<button type="button" onclick="convert()" >Submit</button>
<p id="result"></p>
</form>
<script src="script.js" ></script>

</body>
</html>
21 changes: 21 additions & 0 deletionsprojects/temperature-conversion/script.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -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";
}
}
53 changes: 53 additions & 0 deletionsprojects/temperature-conversion/styles.css
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -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;
}
[8]ページ先頭
©2009-2025 Movatter.jp