Landing Page Project

Table of Contents

• Landing Page
• Architecture
• Usability
• Styling
• HTML Structure
• Contribution to this project

Landing Page

This landing page project to build a multi-section landing page, with a dynamically updating navigational menu based on the amount of content that is added to the page.

Architecture

The project is structured like the one shown below.

css
- styles.css    
index.html
js
- app.js
README.md

Usability

All features are usable across modern desktop, tablet, and phone browsers.

Styling

Styling has been added for active states.

HTML Structure

There are 4 sections that have been added to the page.

Contribution to this project

• The navigation menu is built dynamically as an unordered list.
• When section is being viewed (about 50% of its view hight) while scrolling through the page an active-class with moving background and color change is added automatically.
• When clicking an item from the navigation menu, the link scrolls to the appropriate section.