01
Project Challenge
Objective
Since JavaScript is a popular programming language used for web development, I wanted to experiment with special effects, adding dynamic behavior. I decided to focus on the small functions that make up a website, such as fields, buttons, navigation bars, and scroll effects.
02
Design Approach
Objective
I made the decision to create small projects that are geared towards interaction. As Javascript was predominately used for user validation, I began creating a basic form. I added listeners to validate the name, postcode entry, and the phone entry. To avoid an invalid result, I used expressions to make sure that the data entered matches the same value.
03
Continued
Objective
The next login screen, I implemented animation. When the user highlights each field, an animation becomes active that has a small effect on the email and password fields. I created a div tag named form-control and named it as form-control. This meant that I could use the querySelector, which selects elements from the document object model (DOM) using the CSS selector syntax. I proceeded to add functionality to FAQ boxes and a background slider.
The Drink Water project was created to motivate users to drink more water. Each serving represents 250 ml. When the user reaches 3 litres, the jug fills up to complete. The sound board project generates a sound according to the button selected by the user. Incremental calculator is a feature that I notice on many web pages. This is the reason why I wanted to produce it.