Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Question

Question

Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Without using functions:

1. Include a heading with your name section and today’s date.

2. Insert an image of a blue flower. All images are to be saved in a folder called Lab8_Images.

3. Put the image in a div and using a local style (in-line) in the div to center the image.

Hint: use text-align

4. Insert an h1, h2, h3, h4 and a short paragraph. You decide the content.

5. Write the JavaScript code so that when you to mouse over the blue flower, the h1 changes to read: A Beautiful Blue Flower. Hint: use getElementById (the id goes here).innerHTML to change text.

6. When you click on the h2,

Set the background color of the webpage to palegreen
Chang the font size of the h2 to 56pt
Chang the font size of the h1 to 64pt
Change the text color of the h1 to red

7. When you mouse over the paragraph use JavaScript to make 3 things happen.

Insert an HTML comment to tell what happens,

8. When you click on the h4 change the alignment of the div to put the image on the right edge of the window.

9.Make something neat happen when you click on the h3.

engineering Computer-Science

Add a comment Improve this question Transcribed image text

Answer 1

Answer #1

CODE:

<head>

<title>Document</title>

</head>

<body>

</div>

Abilities forfeited situation extremely my to he resembled. Old had

conviction discretion understood put principles you. Match means keeps

round one her quick.

</h1>

She forming two comfort invited. Yet she income effect edward. Entire

desire way design few. Mrs sentiments led solicitude estimating friendship

fat. Meant those event is weeks state it to or. Boy but has folly charm

there its. Its fact ten spot drew.

</h2>

She forming two comfort invited. Yet she income effect edward. Entire

desire way design few. Mrs sentiments led solicitude estimating friendship

fat. Meant those event is weeks state it to or. Boy but has folly charm

there its. Its fact ten spot drew.

</h3>

She forming two comfort invited. Yet she income effect edward. Entire

desire way design few. Mrs sentiments led solicitude estimating friendship

fat. Meant those event is weeks state it to or. Boy but has folly charm

there its. Its fact ten spot drew.

</h4>

<b>Paragraph</b>

design few. Mrs sentiments led solicitude estimating friendship fat. Meant

those event is weeks state it to or. Boy but has folly charm there its.

Its fact

</p>

</body>

const image = document.getElementById("image");

const header1 = document.getElementById("header-h1");

const header2 = document.getElementById("header-h2");

const header3 = document.getElementById("header-h3");

const header4 = document.getElementById("header-h4");

const paragraph = document.getElementById("paragraph");

image.addEventListener("mouseover", e => {

header1.innerHTML = "A Beautiful Blue Flower.";

});

header2.addEventListener("click", e => {

document.body.style.backgroundColor = "palegreen";

header2.style.fontSize = "52px";

header1.style.fontSize = "64px";

header1.style.color = "red";

});

header4.addEventListener("click", e => {

document.getElementById("image").style.float = "right";

});

header3.addEventListener("click", e => {

header3.style.color = "blue";

header3.style.textDecoration = "underline";

});

paragraph.addEventListener("mouseover", e => {

paragraph.style.fontStyle = "italic";

paragraph.style.backgroundColor = "yellow";

image.style.border = "4px solid black";

});

</script>

</html>

OUTPUT:

Please upvote if you like my answer and comment below if you have any queries or need any further explanation.

Add a comment

Answer 2

Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Homework Answers

Add Answer to:
Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Post as a guest

Earn Coins

Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Homework Answers

Add Answer to: Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...

Post as a guest

Earn Coins

Add Answer to:
Without using functions: 1. Include a heading with your name section and today’s date. 2. Insert...