/landing-page

2nd Project - Landing Page - Udacity Front End Web Developer Nanodegree program

Primary LanguageJavaScript

Landing Page Project

Contents

Description

This is the second project for Udacity's Front End Web Developer Nanodegree program. The aim of this project is to understand how to manipulate the DOM and add contents dynamically to the page. Used Udacity's starter code for HTML and CSS and I wrote JavaScript to make its static page dynamic.

  • Dynamically add sections in the function createNewSections() which implements a for loop for .createElement() and .appendChild().
  • Dynamically create navigation bar with list items that correspond to each section in the function generateNav() using a forEach loop.
  • Highlight above list items when corresponding sections are in the viewport in the function makeActive().
  • Add smooth scroll to anchor ID in the function smoothScroll(), using a forEach loop and a click .addEventListener() to prevent a default scrolling event and add smooth behavior instead.
  • Add smooth scroll to the top button in the function scrollToTheTop.