You are using getElementById but there is no element with id = “about”
Ty to:
<body>
<script src="script.js"></script>
<div class="SlideContent">
<div id="about" class="about">
<div class="home">
<div class="TxtC">
<div class="ctxt">
<div class="TextHead">
Scaledish
</div>
<div class="TextBodyTW">
<a onclick='on()'>About</a>
</div>
</div>
</div>
</div>
</body>
</html>
Well, I can see two problems there:
1 – You have a tag that is missing the >:
<div class="about"
2 – Your JavaScript is looking for an element with an id attribute, but your div has only a class attribute. You could try:
// Get all elements with the class about, and then go to the first element of the array
document.getElementsByClassName("about")[0];
But the best way is to add an id attribute to the div:
<div id="about" class="about">
I am not sure what I am doing wrong, but i get a error in this pen. I am assuming I just put something in the wrong place, but help and a description of what I did wrong would be appreciated
function on() {
document.getElementById('about').style.display ="block";
}
function off() {
document.getElementById('about').style.display ="none";
}.about {
display: block;
z-index: 1;
height: 100%;
margin: 0;
padding: 0;
font-family: 'Roboto Slab', serif;
background-color: #ffffff;<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Scaledish</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" type="image/png" href="https://preview.redd.it/y50x69der7h31.png?width=960&crop=smart&auto=webp&s=9179a708e2b531b3b89eed861c75d04375e6510b" />
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap" rel="stylesheet">
</head>
<body>
<script src="script.js"></script>
<div class="SlideContent">
<div class="about"
<div class="home">
<div class="TxtC">
<div class="ctxt">
<div class="TextHead">
Scaledish
</div>
<div class="TextBodyTW">
<a onclick='on()'>About</a>
</div>
</div>
</div>
</div>
</body>
</html>You didn’t close the tag on line 10 in your pen. You got this kind of error because you are trying to get an element by id, but you wrote a class, which needs a different method. Just use
Thank you for that idea! Dunno what happened on line 10, just copied and pasted to code pen from atom, which does not have that issue
And on that same line you’re missing a closing angle bracket.
And i think it should be
Thanks, Everyone! big help, don’t know how I missed that
Thanks, I don’t know how I missed that, will mark as correct once limit is up!