Giter Site home page Giter Site logo

cd0428-landing-page's Introduction

Landing Page Project

This is a project to practice DOM manipulation with JavaScript and is part of the Udacity Front End Web Developer Nanodegree.

Summary

The starter project was provided by Udacity and has some HTML and CSS styling to display a static version of the Landing Page.

The goals of this project are to convert this project from a static webpage to an interactive one with these requirements:

  • A top navigation is dynamically created from the sections on the landing page
  • Clicking on the navigation sections autoscrolls the user to the relevant section.
  • Each section is styled to identify it as the active seciton when in view.
  • Each section in the top navigation itself is highlghted when the section is active.

Completeing this will require modifying the HTML and CSS files, but primarily the JavaScript file.

Dependencies

  • HTML
  • CSS3
  • Vanilla JavaScript
  • Google Fonts

Set up

To run this project locally:

  1. Clone or download this repository.
git clone https://github.com/Angelica137/cd0428-landing-page.git
  1. Navigate to the project directory.
  2. Open the index.html file in you browser.

Usage

To view and interact with this project:

  • Click on any item in the navigation menu to scroll to the section.
  • See the dynamic highlightning of the section and the navigation item as you scroll through the page.

Author

  • Angelica Beristain
  • Starter code: Udacity

cd0428-landing-page's People

Contributors

angelica137 avatar rcudacity avatar sarah-udacity avatar sudkul avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.