Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

For this assignment you are only to use external CSS and JavaScript. This assignment should have no templates or frameworks. The submission of this assignment

For this assignment you are only to use external CSS and JavaScript. This assignment should have no templates or frameworks. The submission of this assignment will be of a zip file with all images, .css files, .js files, and .html files needed to make the project work correctly. Upload the Zip file to canvas by the due date. Any late assignment will receive a 10% reduction in grade for every day it is late. You are to create a child's game. The game will have a title in the head of the boilerplate with your name. The name of the game will be Fruit Game which will need to be included in the header of the browser using a h1 element. You will display an image of a fruit. Under the image there will be room for text for the name of the fruit but not displayed at the start. You will have four buttons with names for the fruits available. When the button with the fruit name is clicked the name of the fruit will appear under the image of the fruit. If the button and the name of the fruit is the same then you will change the background color for the entire browser green with text feedback saying Correct!. If the button that was selected does not match the text of the image then the background color will change to red with text feedback that says Incorrect. At the bottom of the browser there will be a button that will say Play Again. When the Play Again button is selected, a new image will appear and the background color along with the text under the image will reset so the user can choose again. Task 1. Create a Header with the name Fruit Game 2. Display an image of fruit. The image must have a width of 50% and height of 200px. There should be padding of 20px around the image. 3. There should be text feedback under the image. The font style should be fantasy 4. You should have four buttons that represent the four different fruits and are labeled with the names of the four fruits. When the button is pressed it will give feedback to the correct or incorrect answer. The buttons should be spread across the viewport of the screen evenly and located below the image. The width of the button should be 200px and the height should be 50px. The font size should be medium 5. The background color should change based on the correct or incorrect response of the buttons that are chosen 6. The Play again button should be at the bottom of the browser screen. The button should reset the background color, reset the text feedback, and choose another picture to display. The width of the button should be 200px and the height should be 30px. (hint) You will use a lot of integer variables in your algorithm. Assign each image to display based on an integer that is defined in your script. The buttons should be assigned an integer based on the button that is chosen from the names of fruit. Then compare the two integers to find out if the answer is correct. Display the name of the fruit based on the integer for the image. The play again will increment the image integer 1-4. If the image integer is 4 then the next number will be 1.

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Practical Database Programming With Visual C# .NET

Authors: Ying Bai

1st Edition

0470467274, 978-0470467275

More Books

Students also viewed these Databases questions

Question

Enhance the basic quality of your voice.

Answered: 1 week ago

Question

Describe the features of and process used by a writing team.

Answered: 1 week ago