Question

Make a page with an animal joke.

Make the page show a pop up message when it loads.

Use html, java, css, bootstrap when needed.

Place code in the according to what file they belong too:

Exercise: Alert! Using our standard template, make a page with an animal joke. Set up the library directory, and anything els

0 0
Add a comment Improve this question Transcribed image text
Answer #1

Implemented in html,css,js:

Filename: animal-jokes.html

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="jokes.css">
</head>

<body>
<div id="title">
<div>
<h1>Animal Jokes</h1>
</div>
</div>
<div class="main">
<div class="joke">
<div id="img">
<h2>How does a lion greet the other animals in the field?<br>
“Pleased to eat you.”</h1>
</div>
</div>
<div class="joke">
<div id="img">
<h2>How does a lion greet the other animals in the field?<br>
“Pleased to eat you.”</h1>
</div>
</div>
<div class="joke">
<div id="img">
<h2>How does a lion greet the other animals in the field?<br>
“Pleased to eat you.”</h1>
</div>
</div>
</div>
</body>
<script type="text/javascript">
   alert("This page by YOUR NAME");
</script>

</html><!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <link rel=stylesheet href=jokes.css> </head> <body> <div id=title

Filename: jokes.css

h1 {
font-weight: bold;
color: orangered;
background-color: aquamarine;
font-size: 50px;
text-align: center;
}

#title {
margin-top: 100px;
}

.main {
display: grid;
grid-template-columns: repeat(3, 1fr);
margin-top: 150px;
background-color: aquamarine;
}

.joke {
background-color: aqua;
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: 20px 20px 80px;

margin: 25px;
height: 12rem;
width: 65%;
justify-content: space-around;
padding-bottom: 35.25%;

font-family: roboto;
border-radius: 18px;
background: white;
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0, 9);
text-align: center;

transition: 0.5s ease;
cursor: pointer;
}


#img {
width: 300px;
height: 700px;
margin-top: 40px;
overflow: hidden;
}

ovo AWNA h1 { font-weight: bold; color: orangered; background-color: aquamarine; font-size: 50px; text-align: center; #title

Working Code Output Screenshot:

ty This page says This page by YOUR NAME OKAnimal Jokes How does a lion greet the other animals in the field? Pleased to eat you. How does a lion greet the other anim

If you like my answer, hit thumbs up. Thank you.

Add a comment
Know the answer?
Add Answer to:
Make a page with an animal joke. Make the page show a pop up message when...
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. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
  • for Javascript, JQuery When the page is first opened a user will see the name field...

    for Javascript, JQuery When the page is first opened a user will see the name field and the three vacation images to the left of the page. The page should behave according to the following rules. 1. When a user's mouse pointer goes over any image, that image's border will change to be "outset 10px" and when the mouse pointer leaves that image it's border will change to "none". 2. When the user clicks a "Vacation" image on the left,...

  • C++ please Programming Assignment #6 Help Me Find The Secret Message Description: This assignment will require...

    C++ please Programming Assignment #6 Help Me Find The Secret Message Description: This assignment will require that you read in an encrypted message from a file, decode the message, and then output the message to a file. The encryption method being used on the file is called a shift cipher (Info Here). I will provide you with a sample encrypted message, the offset, and the decrypted message for testing. For this project I will provide you main.cpp, ShiftCipher.h, and ShiftCipher.cpp....

  • For milestone #1, we will start the CARIT site with three static HTML pages and a...

    For milestone #1, we will start the CARIT site with three static HTML pages and a CSS file. Create a dedicated folder for this project. This folder should contain all related files in this project. The future milestones are cumulative and built directly on top of your prior work. Function/content requirements: A home page named “index.html”, which include these contents at least: Description of the center. You may reference the example sites. Latest news: use list tags; make up some...

  • Form Processing HTML One of the most ubiquitous uses of JavaScript is validating form data on...

    Form Processing HTML One of the most ubiquitous uses of JavaScript is validating form data on the client side before it is submitted to the server. It is done everywhere because it is fast and it gives you a great deal of flexibility in how you handle errors insofar as the GUI is concerned. Attached is an image of some code I wrote (so Blackboard can't mess it up). Some things to notice that will help you with the lab....

  • can this code be provided? Project #3 Introduction As you wrap up with JavaScript, let's put...

    can this code be provided? Project #3 Introduction As you wrap up with JavaScript, let's put together everything you've learned to make the classic game "Hangman" in a webpage. If you are unfamiliar with the rules of Hangman, the game works like this: A gallows is drawn on a surface, and Player 1 chooses a word that player 2 must guess. Empty dashes for each letter in the word are drawn next to the gallows (so a 7-letter word means...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT