HTML, CSS and Javascript (extension!)
Follow this tutorial to create a three-column page, with the middle column being flexible-width, and use some basic Javascript to make some dates dynamic.
HTML, CSS and Content
You can populate the contents of your page with whatever you please but you must include:
- A navigation menu (a list of links) in either the left column or the right.
- The ordered list weekly calendar you wrote for assignment #2.
Javascript
Using basic Javascript (no DOM please) and the Javascript Date object, add:
- The current date somewhere on the page
- A header declaring "The Week of X" where the "X" is the date for the Monday of the current week. (so if today is the 1st of October, "X" would be the 28th of September… if today is the 8th of October, "X" would be the 5th of October…)
- For extra marks, create the entire calendar using the Javascript
document.writemethod, and highlight the timeslot which corresponds to the current time in pink.
Marks
- Submission of the HTMl document and default CSS file (5%)
- Use of Javascript (at all): Just do something with Javascript and you've earned yourself 10% (10%)
- Properly structured HTML document and valid CSS: The structure of your HTML document and inclusion of a relevant title element in the head. (15%)
- No tables controlling layout: You are not permitted to use tables for layout purposes. (10%)
- Commenting and indentation will be worth 20%, so comment your work well or you will be marked poorly.(20%)
- Feedback: Your readme file should include information on concepts you stuggled with while writing this assignment. (5%)
- Content: The three-column layout, the inclusion of the Calendar and the dynamic generation of the "week of…" heading will be worth 10% (15%)
- Definition of 'Client-Side': Javascript is a 'client-side' scripting language. In your readme file, exlpain what this means, and – to contrast – what server-side scripting means. (15%)
- Demonstrating an understanding of the concepts behind HTML, CSS and Javascript (%5)
- Properly formatted HTML: Every parse error in your HTML (floating < > characters, improperly closed tags) will result in a 10% penalty.
- No use of the 'style' attribute nor element: You are not permitted to use the style attribute nor the style element in this assignment; not even for elements generated using Javascript! Every CSS property which appears outside your CSS file will result in a 5% penalty.
What to Submit
Submit an archive file which contains:
- A readme.txt file
- The HTML document (your Javascript can be in your HTML file)
- The CSS
- Any images etc your HTML document or CSS requires
You must submit a readme.txt file, which should include your name, your ENCS username, and your student ID number. If you don't you will be penalized by up to %20 in addition to losing marks for any missing work which would have been in the readme file.