Banner Logo with hotspot linking to home page Site information with hotspot linking to the about page.


This page outlines features of final projects in Dreamweaver and JavaScript.

Dreamweaver Final Project
  • Created site definition
  • Set page properties
  • Selected colors, fonts, graphics and layout (used prebuilt liquid one column page with header  and footer)
  • Created multiple pages (About, Contact, Movie, Course pages)
  • Typed text into pages
  • Copied text in from other sources (college catalog)
  • Checked spelling on home page
  • Created CSS styles
  • Moved styles to external stylesheet
  • Added navigation with links to other pages
  • Created footer with copyright information
  • Added AP div for  butterfly graphic
  • Butterfly graphic in AP div has rollover behavior and links to final project (Movie page)
  • Used tables for links to course information pages and for contact form
  • Added validation behaviors to contact form
  • Made image map out of logo graphic with butterfly linking to home page and RenLu’s logo linking to about page
  • Used onmouseover  behavior on textbook graphics to display brief course description in table
  • Added keyword and description content to head content of all pages
  • Added Spry shake effect to butterfly graphic in AP div
  • Added Spry accordion widget to About page to display information about Dreamweaver project vs. JavaScript project
  • Added alternate stylesheet for print media
JavaScript Final Project
  • Simple animation using case logic to alternate images displayed in table.
  • Greeting message dynamically created substituting morning, afternoon or evening depending on time of day.
  • Used cookies to save Last Visit Date and Time and Number of Visits to Web site.
  • Added button to Movies page to link to other movie pages.  There are no navigation links.
  • Top Ten Movies page uses butterfly animation from book using CSS positioning
  • Top Ten Movies page uses buttons to display information about each movie in a separate window with onfocus.
  • Separate windows displaying movie information use onmouseover and onmouseout to display text in different color.
  • Movies Guessing Game page uses radio buttons to allow user to pick a movie to play the guessing game with (arrays and string manipulation).
  • Movies Voting page allows contact information to be entered and uses radio buttons for user to vote on favorite movie.
  • A regular expression is used to validate the email address on this form and functions are used to insure entry of alphanumerics in alphanumeric fields and numerics in numeric fields.
  • All of the above features are done with JavaScript functions that use loops and decisions where necessary.  The pages use a layout created in Dreamweaver and are stripped of everything except the header and footer.  Everything else was entered in code view as XHTML and JavaScript with no help from Dreamweaver.