A web site | Computer Science homework help

/in /by

Creat a web site for a person or character either real or imaginary.  This project will include many skills.

This does not need to be a serious profile feel free to be creative with the character and their profile, Go as crazy as you like just make sure you hit all the requirements.

Requirements

You will need at least the following pages:

  • A home page
    • The character’s professional profile will be displayed here.  You should include paragraphs about the person.  Where is the person from?  What do they do?  How did they get to this point in their life?
    • The page should summarize who the person is and what they do.  An image of the person is necessary
  • A favorites page
    • Just like before, this should include a list of favorite things for the person or character.  You must include an ordered nested list with different numbering schemes for each level.
  • A style change page
    • This page will allow the user to “play” with your web page.
    • You must have only one of the following
      • A page with 2 text boxes where the user can enter a color value for the font and background color, a button for the user to press, and a sample paragraph which will update to the colors the user picks.  When the user clicks the button, the paragraph font and background color must change to the user input values.  You must use JavaScript to change the colors of the font and background and the page should not submit when the user presses the button.  You must also use JavaScript to make sure the user entered a value into atleast one of the text boxes when they press the button.  If both text boxes are empty an alert should come up explaining so.
      • A page with ONE image element and 3 buttons.  When the user clicks on the buttons the image element is updated with a new image.
      • A page with 4 paragraphs stacked one on top of the other but in such a way that each paragraph has an area where the mouse can reach it.  When the mouse is moved on one of the paragraphs, that paragraph becomes the top one in the stack.  The trigger is the mouse entering the paragraph, not a click.  The paragraph should stay as the top paragraph until the user moves the mouse on a different paragraph.  Use a different background color for each paragraph.
  • A page to where a user can purchase something.
    • The person you are designing this page for offers something for sale and you must create a form where the user can buy it.  The items for sale are up to you but try to make it match with the profile of the person you are making this for.  If you are a superhero, maybe the things for sale included a used cape, or a fake disquise.  You can sell just about anything, as long as it’s school appropriate.
    • You must have at least 3 things to sell.
    • The form must be a table and the table must look like this
Items
Item Cost Quantity
Item 1 $xx.xx  
Item 2 $xx.xx  
Item 3 $xx.xx  

 

    • The quantity column must contain a text box where the user can enter how many of each item they want.
    • The form must also include inputs for the user name (first and last), address, city, state, and ZIP code.
    • The form must also include the options of payment.  The available options are cash, check, or credit card.  These must be presented as radio buttons and only one is selectable.
    • The form must have a submit and reset button.
    • When the user clicks the submit button, you mus use JavaScript to verify the following
      • ALL of the user information is entered.
      • The quantity fields contain valid numbers, if they are filled out.
    • If everything is valid, the form must submit to a PHP script which will output the following
      • The user information including name, address, city, state, and ZIP.
      • Some sort of organized output of only the items the user purchased.
      • A subtotal for each item.
      • A total for everything.
      • What the user selected as a payment option.

RULES

  • You must use CSS for ALL styles on all pages: you are not allowed to use any style tags such as <b> or style attributes such as bgcolor.  Do not use the style attribute in your HTMl pages.
  • You are allowed to use document or external style sheets. 
  • Your document layouts must also be either very basic or use an external CSS for the layout, you cannot use a table to structure your web page layout.  You can use a table to place your elements, but don’t use a table to place things such as headers or navigation if you are using them.
  • The style/theme of your pages must remain similar from page to page.  So if you have a blue background on one page, the rest of the pages should also have a blue background for consistency.
  • You can use JavaScript to change the style property of an element.

need to be organized in your documents.  That means your CSS will need to be in a folder named style, your JavaScript in a folder named scripts, and your images in a folder named images.