[SOLVED] WEB222 Assignment 3

This assignment is a continuation of Assignment  2,  thus all the requirements for this assignment is to be made “on top” of your Assignment  1.

Responsiveness

You are to make your Home Page and Now Playing pages responsive. Note, for this assignment,  you are only required to make it look good for desktop and mobile devices. Thus, you should only write media queries breakpoints for smartphone devices given that Assignment 1 you would have already developed your website to look good for desktop and large screen  devices.

Automatic Image Carousel  

You are to convert your Hero section from a static image to an automatic image carousel that switches between images every 5 seconds. Note that your image carousel must have at least 5  images. Each image must be sized the same(via code)  so that it looks uniform.

Lastly, your image carousel  must have two arrows, a left arrow and a right arrow. This is used to control the direction of the images. If the left arrow is clicked then your image carousel should reverse the direction the images are flowing.  Whereas, if the right arrow is clicked then the direction of the image should return to the original flow.

The automatic image carousel should flow similarly to the image carousel on https://www.amctheatres.com/  Hero Section

Example : 

Movie Details Page  

Convert the movie details page from a separate page into a WELL DESIGN  popup modal. Thus, on the Now Playing Movies page, when the user clicks on a poster image, a popup modal must be displayed. The popup modal should display all the pertinent information of the clicked movie. The Information should include : movie title, ratings, overview, featured crew, the latest movie page and the link to the trailer of the movie.  The modal should also have an X . When the X is pressed, the modal should be “closed.”