This repository contains the projects of Course 1 of Coursera Specialization course - "Full Stack Web Development by The Hong Kong University of Science and Technology".
https://www.coursera.org/learn/html-css-javascript/home/welcome
The course 1 of this specialization deals with HTML,CSS and Javascript and is taught by David Rossiter. It is a three week course and there is assessment projects at the end of each week.
Link to descriptional video : https://www.coursera.org/learn/html-css-javascript/lecture/jpKry/html-css-assessment
It comprises of three parts:
-
part1.html: part1.html contains the Web page content without style. The result of this stage is a web page which contains a form.The form contains various form elements like text input, submit button, checkboxes, radio options that can be selected and in which the data can be entered. It shows the basic layout of the given web page.
-
part2.html: part2.html is the extended version of part1.html which adds proper styling to the page to make it more beautiful and attractive.
3.part3.html: part3.html is a modified code of part2.html which contains some additional interactive features.
Two interactive features are added.
-
#hover_effect: Style rules are added so that the label and input elements become significantly larger when the mouse is moved over them (and return to normal size when the mouse moves away from them). This is achieved by using the hover pseudo-class for all label and input elements.
-
#image_preview: A <script> instruction is added before , near the end of the file. It is a link to some JavaScript code. After this is added the face image will be immediately shown in the web page after the user selects a file using the file selector (the first input element).
Link to descriptional video : https://www.coursera.org/learn/html-css-javascript/lecture/SyzG2/introduction-to-javascript-assessment
It comprises of two parts:
-
part1.html : part1.html is a simple version of the game. When the file is loaded a color is randomly selected from an array of colors and a loop begins which repeatedly asks the player what the color is. However, no feedback is given to the player depending on what he/she enters. The loop simply finishes when the player enters the correct color.
-
part2.html : part2.html is the complete game and has an interesting feature.It changes the background colour of the page when user guess the right colour.
Link to descriptional video : https://www.coursera.org/learn/html-css-javascript/lecture/9pxsz/walkthrough-video-for-matching-game
It is a very interesting game to play with.The page is divided into two part which contains identical faces on both side except one face.We have to find that extra face on the left side.
It comprises of four parts:
- part1.html : Matching Game Part 1. Web page content without JavaScript
- part2.html : Matching Game Part 2. Generating the left side images
- part3.html : Matching Game Part 3. Extend the JavaScript code developed in Part 2 to handle the right side
- part4.html : Matching Game Part 4. Finishing the game