MaxInterview - day and night mode javascript

showing results for - "day and night mode javascript"

09 May 2020

1//Source: https://www.w3schools.com/howto/howto_js_toggle_dark_mode.asp
2
3<!DOCTYPE html>
4<html>
5<head>
6<meta name="viewport" content="width=device-width, initial-scale=1">
7<style>
8body {
9  padding: 25px;
10  background-color: white;
11  color: black;
12  font-size: 25px;
13}
14
15.dark-mode {
16  background-color: black;
17  color: white;
18}
19</style>
20</head>
21<body>
22
23<h2>Toggle Dark/Light Mode</h2>
24<p>Click the button to toggle between dark and light mode for this page.</p>
25
26<button onclick="myFunction()">Toggle dark mode</button>
27
28<script>
29function myFunction() {
30   var element = document.body;
31   element.classList.toggle("dark-mode");
32}
33</script>
34
35</body>
36</html>
37
38

queries leading to this page

how to day and night mode with javascript how to day and night mode with javascript date format day and night mode javascript html css js night 2fday mode day and night mode with time javascript day and night mode javascript