sunil2809
Mitglied
Hallo zusammen,
ich tüftle seit einer gefühlten Ewigkeit an einem JavaScript Code herum, der aber nicht funktionieren will. Könnt ihr mir helfen?
Mein Ziel ist es, dass wenn ich auf einen Button klicke, sich die Seite in ein "Dark-Theme" umwandelt. Das klappt so auch wunderbar:
Das hier ist meine JS Funktion
Hier mein CSS
und hier mein HTML
Nun möchte ich aber alle Elemente bearbeiten. Also habe ich folgendes geändert:
So funktioniert das Ganze leider nicht meher.
Ich stehe grade echt auf dem Schlauch und freue mich deswegen über jede Antwort von euch!
Linus
ich tüftle seit einer gefühlten Ewigkeit an einem JavaScript Code herum, der aber nicht funktionieren will. Könnt ihr mir helfen?
Mein Ziel ist es, dass wenn ich auf einen Button klicke, sich die Seite in ein "Dark-Theme" umwandelt. Das klappt so auch wunderbar:
Das hier ist meine JS Funktion
Javascript:
function toggleTheme() {
document.getElementById('nav').classList.toggle('dark');
}
Hier mein CSS
CSS:
#nav {
background: #fff;
}
.dark #nav {
background: #333;
}
und hier mein HTML
HTML:
<button onlick="toggleTheme()">Dark</button>
<div id="nav">
<ul>
<li>Home</li>
<li>About</li>
</ul>
</div>
Nun möchte ich aber alle Elemente bearbeiten. Also habe ich folgendes geändert:
Javascript:
function toggleTheme() {
document.getElementsByClassName('*').classList.toggle('dark');
}
CSS:
body {
background: #fff;
}
.dark body {
background: #333;
}
.dark #nav {
background: #333;
}
So funktioniert das Ganze leider nicht meher.
Ich stehe grade echt auf dem Schlauch und freue mich deswegen über jede Antwort von euch!
Linus
Zuletzt bearbeitet: