top of page

11.12.20

LAB - JAVASCRIPT DOM MANIPULATOR AND SLIDESHOW

Assignment:

PART 1

1. Create an SINGLE HTML page that is styled with CSS and controlled via JavaScript. The purpose of this assignment will be to manipulate the DOM in order to transform the overall appearance and presentation of the website. You will need to:

- Create four buttons that each call a separate function.

- Each function will need to change the webpage to a different season (Spring, Summer, Fall, Winter) or 4 four other categories of content if you choose not to do seasons.

- Upon changing to a new season, the background image of the page, font sizes, & and family, as well as color palette must change to match the season/theme.

- Your page must include 1 paragraph of text, 1 heading, and an image element as well that also must swap when the change buttons are pressed. For an additional challenge, incorporate html input range sliders to control various properties

 

PART 2

2. Create an SINGLE HTML page that contains a hand-coded JavaScript Slideshow.

- Slideshows should contain at least 3 different images, each with it's own text description.

-  Each image within the slideshow should link to a different destination.

- You should include Next and Previous buttons to cycle through the slideshow.

- Your slideshow content (Images, Descriptions, Links) should be stored within arrays

- You should use a counter variable to cycle through the array values and pull up each image and corresponding content..

- You should use an if/else condition to restart the slideshow once you have reached the last image (moving forward) or the first image (moving backwards)

bottom of page