BSEN307 E-Commerce Website II

CSS DHTML Project-2

Instructions:

  1. Create a basic page using DreamWeaver or a tool of your choice.  Name the page dhtmlproject-2.htm.  Place the following elements on the page.
    1. An H1 that says "Welcome to the Test Page".
    2. A paragraph that says "Click on the following buttons to see some possible patterns for your page".
    3. A button with a label of "Pattern 1".
    4. A button with a label of "Pattern 2".
    5. A button with a label of "Normal".

     

  2. Apply an internal style sheet that creates the following effects
    1. Change the font color of the H1 tags to green
  3. Use an inline style command to center the H1 element.
  4. Apply the following DHTML effects
    1. When the page is loaded run a function that will set the placemat.jpg image as the background and change the font color to black.
    2. When Pattern 1 is clicked activate a function called patternOne() that will change the background image to hardwoodfloor.jpg and change the text color to 'gold'.
    3. When Pattern 2 is clicked activate a function called patternTwo() that will change the background image to fallleaf.jpg and change the text color to 'ivory'.
    4. When Normal is clicked activate a function called patternNormal() that will place the placemat.jpg image in the background and change the font back to black.
  5. When complete please post the project to your student server account.  Make sure and test your project from the server to make sure it works.

Note: The images for this exercise can be found in the class folder on the N: in a folder labeled Sample Images.