INTERACTIVE MEDIA DESIGN: Grade Equivalent
ASSIGNMENT NO. 2
CODE:
<!DOCTYPE html>
<html>
<head><h3><style type="text/css">
div {
margin-bottom: 10px;
}
label {
display: inline-block;
width: 120px;
}
fieldset {
background:#ffff33;
}
legend {
padding: : 20px 0;
font-size: 20px;
}
</style>
</head>
<fieldset>
<body>
Enter your name: <input type = "text" placeholder="Type" id="Fname" Value=" "><br><br>
Enter your Score: <input type = "text" placeholder="Score" id="score" Value=" "><br><br>
Enter total number of items: <input type = "text" placeholder="Total" id="total" Value=" "><br>
<button type = "button" onclick="next();">Compute</button>
<script>
function next(){
var n1 = (document.getElementById("Fname").value);
var n2 = Number (document.getElementById("score").value);
var n3 = Number (document.getElementById("total").value);
grade = (n2/n3);
grade2=(grade*100);
alert("Name: " + n1 + "\n\nScore: " + n2 + "\n\nTotal: " + n3 + "\n\nEquivalent Grade: " + grade2);
document.write("Name: " + n1 + "<br> <br> Score: " + n2 + "<br> <br> Total: " + n3 + "<br> <br> Equivalent Grade: " + grade2);
}
</script>
</body>
</fieldset>
</html>
RESULT:
Comments
Post a Comment