How would I create a web application for a website where the application collects a person's height and checks it against a stored value. If the height is under 130cm or over 200cm then it needs to have an output saying if the person is too short or too tall and by how much. This needs to be done in JS/HTML Thanks
Welcome to Code Forum!
Join a community that supports you and your coding journey from day one. We strive to be a friendly, supportive community that empowers everyone to be better developers. By registering with us, you'll be able to discuss, share and private message with other members of our community.
-
Guest, before posting your code please take these rules into consideration:
- It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
- You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
- Don't share a wall of code. All we want is the problem area, the code related to your issue.
To learn more about how to use our BBCode feature, review our "How to post your code into threads" here.
Thank you, Code Forum.
JavaScript JS/HTML height checker
- Thread starter Max Lomas
- Start date
BGB
Silver Coder
You can update this as you want -
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Height Checker</title>
<meta http-equiv="Content-Type" content="text/html"/>
<style>
* {
box-sizing: border-box;
}
body {
font-family: Tahoma, Geneva, Verdana, sans-serif;
}
.container {
width: 30%;
height: auto;
margin: 0 auto;
padding: 10px 0px;
border: 4px solid #1a75ff;
border-radius: 15px;
}
label {
margin: 10px;
}
input[type="text"] {
margin: 10px;
}
input[type="button"] {
margin: 10px;
padding: 5px 10px;
color: #fff;
background-color: #ff3333;
border: none;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #ff4d4d;
}
</style>
</head>
<body>
<h1 style="text-align: center;">Height Checker</h1>
<div class="container">
<label for="checker">Enter your height</label><br>
<input type="text" id="checker" name="checker"/><br>
<input type="button" value="Submit" onclick="check_number()">
</div>
<script>
var upper = 200;
var lower = 130;
function check_number(){
var num_text = document.getElementById("checker").value;
if(num_text > upper) {
alert("Your are too tall for this screen");
} else if(num_text < lower) {
alert("Your are too short for this screen");
}
}
</script>
</body>
</html>New Threads
-
-
What Should I Look for in a Link-Building Service for Restricted Industries?
- Started by kemiy
- Replies: 2
-
-
Where Can I Find the Correct AetherSX2 BIOS for Europe?
- Started by kemiy
- Replies: 1
-
Share this page
Buy us a coffee!
