I'm working on this small project for college. I need to make and interactive page using html/css/javascript. The problem is, my javascript doesn't work, I've tried using lecturers script that is meant to work 100%, but even then it doesn't. I checked my browser settings, and made sure that javascript is allowed. Maybe someone can see what the problem is.
I'm currently trying to make a slider for this page and connect it to a .js file. I used same code our lecturer showed. Slider is there, but it is not displaying the value for me. Here's my html code
<!DOCTYPE html>
<html>
<head lang="en-IE">
<meta charset="utf-8">
<title>Disney Game</title>
<link rel="stylesheet" href="stylesheet.css">
<script src="javascript.js"></script>
<head>
<body>
<header>
</header>
<main>
<div class="flex-box">
<div>
<form action="" onsubmit="return false;">
<label>How much do you like Disney?:</label>
<p>
0<input type="range" min="0" max="10" id="likeDisney">10<span id="opinion"></span>
</p>
</form>
<img src="images/Donald_Duck.jpg" alt="Donalt_Duck">
</div>
</div>
</main>
<footer>
</footer>
</body>
</html>
And here is the javascript code:
document.getElementById("likeDisney").onchange= slide;
function slide()
{
var likedisney = document.getElementById("likeDisney").value;
if (likedisney>6) {
document.getElementById("opinion").innerHTML="Love it!";
}
else if (likedisney>4) {
document.getElementById("opinion").innerHTML="Like it!";
}
else {
document.getElementById("opinion").innerHTML="Not a fan of Disney";
}
}