I'm basically trying to make a night-mode for my website (https://arcunofox.github.io by the way). Here's my HTML/JS:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<head>
<meta charset="utf-8" />
<title>Arcuno | Music</title>
<link rel="icon" href="Images/arcunologo.ico">
<link rel="stylesheet" href="css.css">
</head>
<body>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<div class="header">
<img src="/Images/rsz_arcuno.png" alt="Arcuno logo" width="200px" height="200px">
<p>"Sunshine, we all see the same sky" - Belle and Sebastian</p>
</div>
<center>
<div class="navbar">
<a href="https://arcunofox.github.io/music.html">Music</a>
<a href="https://arcunofox.github.io/index.html">Home</a>
<a href="https://arcunofox.github.io/links.html">About</a>
<button id="moon" class="fa fa-moon-o" onclick="document.getElementById(content).style.backgroundColor = '#4b4b4b', document.getElementById(content).style.color = 'white', document.getElementById(moon).style.display = 'none', document.getElementById(sun).style.display = 'inline-block'"></button>
<button id="sun" onclick="document.getElementById(content).style.backgroundColor = 'white', document.getElementById(content).style.color = 'black', document.getElementById(sun).style.display = 'none', document.getElementById(moon).style.display = 'inline-block'" class="fa fa-sun-o"></button>
</div>
<div class="content">
<br/>
<h3>Music Collection</h3>
<p>I make a lot of music, and here you can see all of my songs and albums that I have released.
</p>
</div></center>
</meta>
</body>
</html>
There is more to the file but its irrelevant to the issue. Anyways, I get this error:
Uncaught ReferenceError: content is not defined
at HTMLButtonElement.onclick (music.html:26)
onclick @ music.html:26
Here is the CSS for #content if that is needed:
#content {
margin: 0px;
}
#content h2 {
margin: 0px;
}
That's literally it. I don't know much JS so please go easy on me, thanks!
Aucun commentaire:
Enregistrer un commentaire