Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

Question

Question

Need help with creating this JavaScript file. I'm not sure where or how to begin.

1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use the addEventListener, in addition you may need to use id and class attributes as needed. The .html and .css files have been provided to you. See the .png files for an example of what is expected.

2. Place the javaScript file in its folder.

3. Roll over the yellow button and make the paragraph below it disappear.

4. Click the blue button and using an alert display information about MTC. Create an array to hold the data. Using a loop, display the data. MTC offers more than 120 degree, diploma and certificate programs. MTC has 6 Campuses. MTC offers courses in both the day and evening. MTC offers distance learning opportunities.

5. Click the purple button and display information about online Universities in a paragraph below the button. You consider using a JSON object. In the style sheet,
set the font size of the below paragraph to .75em. University Name, Motto, Number of Enrolled Students, Location, and Website Review the image for a list of the particulars Each university name should have a different color. With each click, the paragraph is refreshed. The data should not accumulate.

HTML

<!doctype html>
<html lang="en">
<head>
<title>addEventHandler book practice.</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>

<section>

<input type="button" value="Roll Over Me" class="rollOverMe" />
<p>This paragraph will burn from the heat of the sun!</p>
</section>

</section>

</body>
</html>

CSS

body
{
background-color:White;
}

.hide
{
display: none;
}

.rollOverMe
{
width:200px;
height:200px;
background-color:yellow;
color:darkgray;
margin-top:50px;
font-size:2em;
border-radius: 100px 100px;
border: 1px solid darkgray;
}

.MTC
{
width:200px;
height:200px;
background-color:blue;
color:yellow;
margin-top:50px;
font-size: 2em;
border-radius: 100px 100px;
border: 1px solid darkgray;
}

.Universities
{
width:200px;
height:200px;
background-color:purple;
color:white;
margin-top:50px;
font-size:2em;
border-radius: 100px 100px;
border: 1px solid darkgray;
}

p
{
font-size:1.5em;
margin:10px;
}

section
{
margin-left:50px;
float:left;
width:450px;
}

Click Me Roll Over Me MTC University Name: University of Phoenix Motto: We Rise Number Enrolled: 142,500 Location: Phoenix, A

engineering Computer-Science

Add a comment Improve this question Transcribed image text

Answer 1

Answer #1

document.getElementById("MTC").addEventListener("click", function(){
     var info = ["MTC offers more than 120 degree, diploma and certificate programs", " MTC has 6 Campuses","MTC offers courses in both the day and evening", "MTC offers distance learning opportunities."];
     var i;
     for(i=0;i<info.length;i++){
     window.alert(info[i]);
     }
});

document.getElementById("universities").addEventListener("click", function(){
var data = "add your data here";
document.getElementById("university").innerHTML = data;
});

</script>

Add a comment

Answer 2

Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

Homework Answers

Add Answer to:
Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

Post as a guest

Earn Coins

Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

Homework Answers

Add Answer to: Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

Post as a guest

Earn Coins

Add Answer to:
Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...