Skip to content

imaadiiii/Interactive-Navigation-Menu

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Interactive Navigation Menu

This project showcases an interactive navigation menu that changes color when scrolling and hovering over menu items. The menu has a fixed position and is visible on all pages, providing a smooth user experience.

Check out my Interactive Navigation Menu

https://interactive-navigation-menu-rosy.vercel.app/

Features

  • Fixed navigation menu visible on all pages.
  • Background color changes on scroll.
  • Menu item background and text color changes on hover.
  • Smooth transitions for color changes.
  • Responsive design.

Technologies Used

  • HTML
  • CSS
  • JavaScript

Installation

  1. Clone the repository:
    git clone https://github.com/imaadiiii/PRODIGY_WD_01.git
  2. Navigate to the project directory:
    cd interactive-navigation-menu

Usage

Open the index.html file in your web browser to see the interactive navigation menu in action.

File Structure

interactive-navigation-menu/
│
├── index.html
├── styles.css
└── script.js
  • index.html: Contains the HTML structure of the navigation menu and sections.
  • styles.css: Contains the CSS styles for the navigation menu and sections.
  • script.js: Contains the JavaScript for adding interactivity to the navigation menu.

Customization

You can customize the navigation menu by editing the HTML, CSS, and JavaScript files. Here are a few ideas:

  • HTML: Add or remove sections by updating the index.html file.
  • CSS: Change the colors, fonts, and other styles in the styles.css file.
  • JavaScript: Modify the scroll behavior and other interactive features in the script.js file.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Contributing

Contributions are welcome! Please open an issue or submit a pull request with any improvements or bug fixes.

Contact

If you have any questions or suggestions, feel free to reach out.


Feel free to modify the content to better suit your project and preferences.

Releases

No releases published

Packages

No packages published