Question

using HTML JAVA AND CSS all embeded on one page. create a page with some black...

using HTML JAVA AND CSS all embeded on one page. create a page with some black paragraph text against a white background, on the page pu a button labeled night mode. when the button is clicked the backgrournd should turn black all text should be white. when the button is initially clicked, the text should change to say "day mode"

Homework Answers

Answer #1

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
padding: 25px;
background-color: white;
color: black;
font-size: 25px;
}

.dark-mode {
background-color: black;
color: white;
}
</style>
</head>
<body>

<h2>Hello World</h2>
<p>Happy code</p>

<button onclick="myFunction()" id="button">night mode</button>

<script>
function myFunction() {
var element = document.body;
var button = document.getElementById("button");
let value = button.value;
if(value == "dark"){
        button.value ="light";
button.innerHTML = "night mode";
}else{
button.value ="dark";
button.innerHTML = "day mode";
}

element.classList.toggle("dark-mode");
}
</script>

</body>
</html>

Know the answer?
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for?
Ask your own homework help question
Similar Questions
Create a webpage with CSS Box Model: Create a basic web page using the 5 required...
Create a webpage with CSS Box Model: Create a basic web page using the 5 required html tags. Add paragraph tags and enclosed them with a div element. Using the CSS Box Model, style the div element to have a total width of 350px and a height of 250px. It should have 10px padding on all sides, a gray border of 5px on all sides, and 15px margins on both sides but none on the top and bottom. Add a...
use CSS, java and HTML to make a charity admin page. It's a web page after...
use CSS, java and HTML to make a charity admin page. It's a web page after you log in to your account. I can have personal information, the amount of money donated, the children who have received charity, and some blogs. In fact, all the things are what I want. But you are free to do whatever You like, even if you don't say what I say. I just need a charity Admin page for charity User.Don't ask me for...
Please linked both files. For this assignment you need to create a ToDo list using Javascript,...
Please linked both files. For this assignment you need to create a ToDo list using Javascript, along with HTML and CSS. Begin by creating a HTML page called todo.html. Then create a Javascript file called todo.js and link it in to the HTML page using a script tag. All Javascript for the assignment must be in the separate file. (For CSS, feel free to include styles in a style block at the top of the HTML page, or to link...
//Create a New Java Project called CheckBoxes. //Write a program with two checkboxes, one labeled BLUE...
//Create a New Java Project called CheckBoxes. //Write a program with two checkboxes, one labeled BLUE and the other labeled ORANGE. When no checkbox is selected, the panel’s background color should be gray and its foreground color should be black. //When only the BLUE checkbox is selected, the panel’s background color should be blue and its foreground color should be yellow. When only the ORANGE checkbox is selected, the panel’s background color should be orange and its foreground color should...
For this assignment, create an html page that has a login form. The form should have...
For this assignment, create an html page that has a login form. The form should have 3 input elements -- 1. This should have a type text for the user to enter UserName 2. This should have a type password (like text except cannot see the text that is typed in), for the user to enter password. 3. Submit button (type submit, as we did in class on 2/6). The form method should be set to POST and the action...
This will be my third time submitting this question. THERE SHOULD BE NO USE OF CSS...
This will be my third time submitting this question. THERE SHOULD BE NO USE OF CSS OR SWITCH STATEMENTS IN THE JAVASCRIPT. Even though there is stylesheet in the HTML file do no create a new one. Project Standards: Students will use click events to capture user input. Students will use variables to store information needed by their application and keep track of their program’s state. Students will use conditionals to control project flow. Project Task You will be building...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>All Pets Veterinary Hospital</title> <style> body { font-family: arial,...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>All Pets Veterinary Hospital</title> <style> body { font-family: arial, sans-serif; font-size: 100%; } /* outer container */    #wrapper { width: 960px; margin: 50px auto; padding: 0px; background-color: rgb(255, 255, 255); /* white */ border: 1px solid #000; /* black */ }    header h1 { text-align: center; }    nav { text-align: center; background: rgb(175, 196, 206); }    address figure { text-align: center; } </style> </head> <body> <div id="wrapper"> <!-- outer...
Need this done using PHP code and not javascript Create a PHP form with a textarea...
Need this done using PHP code and not javascript Create a PHP form with a textarea field input and a submit button. The textarea field should be able to accept up to 250 characters. When the user clicks the Submit button, read the text in the textarea and display the following results on a web age. At the bottom of the page include a link back to the form. Number of characters: Number of words: (hint: explode the string into...
Challenge 5 Read ALL of the instructions carefully before starting the exercise! Dear Colleague, Earlier today...
Challenge 5 Read ALL of the instructions carefully before starting the exercise! Dear Colleague, Earlier today I built my fourth website using HTML5 and CSS3. This time I wanted to try using CSS float layout options on a website dedicated to my favorite topic: robotics. I wanted my website to look like what is shown in Figure 1 (see below). However, after giving it my best effort, things once again didn’t turn out the way I wanted (see the code...
Please review the following below and provide , one-page reaction to this budget proposal. 1. Budget...
Please review the following below and provide , one-page reaction to this budget proposal. 1. Budget The President’s Budget and Health Care While the president’s budget is not likely to be acted upon by Congress, it does signal what the administration’s priorities are—as well as what policy initiatives they might push. Repeal the Affordable Care Act: The administration’s budget includes a plan that is based upon the plan put forward by Sens. Lindsey Graham (R-SC) and Bill Cassidy (R-LA) last...