CSC 343: The Week beginning Feb. 2

• Homework:
  
  HTML: Make a page that uses <header>, <i>, <del>, <ins>, <kbd>, <link>, <main>, and <mark>. See http://www.w3schools.com/tags/ for explanation and examples of how to use these HTML tags.
  
  CSS: Watch the CSS Typography - Change Font, Size, Spacing & more and the CSS Absolute and Relative Positioning Tutorial Then make a page like that in the second video with an image positioned at the bottom of its containing element (which cannot be the page/body itself). The page should also have some text with the following attributes styled: font-family, font-size, letter-spacing, word-spacing, text-shadow, line-height, text-indent and text-align (they don't all have to be applied to the same text).
  
  jQuery: Make a page that has a jQuery UI Accordion http://jqueryui.com/accordion/. Click on view source. Change the content. Make sure you change the href of the link tags and src of the script tags to full URLs. For the first three that means adding http:. For the fourth it involves converting their relative path to a full path. Similarly on the same page or on a different page make a demo page with an Autocomplete widget and a Datepicker widget (click on the corresponding links on the left).
  
  Due: Feb. 10
  
  
• Tuesday:
  
  Neighbors.htm demonstrates jQuery methods next(), prev(), parent(), children(), eq(), etc.
  
  StateCapitalObject.htm uses an array of JavaScript objects
  
  StateCapitalDynamicTable.htm allows the number of rows of the table to be determined in code.
  
  StateCapital_Animation.htm adds an animation
  
  DogObject.htm demos using a prototype to add to an object.
  
  DogObject2.htm demos using JavaScript Object Notation (not from a file).
  
  DogObject3.htm demos using JavaScript Object Notation and using a prototype together.
  
  Dog/Dog_From_JSON_File.html uses Dog/DogData.json and DogBreeds.zip Best viewed in Firefox. Chrome "wants" the page to be posted on a server to work.
  
  Lab A (Car Object Array) Write a Car object function. You can find data at http://www.car-data.com/ -- just select a car and then scroll to the bottom of its page.
  
  
  
  The properties must include make, model, image, cityMileage, highwayMileage, fuelCapacity and at least two other properties. As part of your object include a function that determines how far the car will do (in the city) on a full tank of gas cityMileage*fuelCapacity. Make an array of at least three car objects. Make a page that allows the user to choose a car from a drop-down select and than display the corresponding image and other information.
  
  Lab B (JSON for President) Read the JSON file Presidents.json. Use the information to populate a select with the names of the Presidents. When the user selects a president using the drop-down select the name, dates and nickname of the president should be displayed as should the corresponding image of the president. Uses images contained in PresidentZip.zip