Netflix India Landing Page Project

Overview

This project is a static landing page for Netflix India. It provides information about the streaming service, highlights its features, and includes a Frequently Asked Questions (FAQ) section. The landing page has a responsive design and incorporates various elements, including a video background, navigation bar, header, features section, FAQ section, and a footer.

Project Structure

• index.html: The main HTML file contains the structure of the landing page.
• style.css: The CSS file styles the HTML elements.
• app.js: The JavaScript file handles the opening video functionality.

HTML Structure

The HTML file (index.html) is structured as follows:

1. Head Section:

   • Includes meta tags, title, external CSS stylesheets, and links to external fonts and libraries.
   • Sets up the viewport and character set for the document.

2. Body Section:

   • Contains an opening video with a mute autoplay feature.
   • Features a navigation bar with a logo, language button, and sign-in button.
   • Displays a header section with promotional content and an email sign-up form.
   • Showcases four feature sections with images and descriptions.
   • Presents a FAQ section with accordion-style questions and answers.
   • Includes a footer with links and contact information.
   • Links external JavaScript file (app.js).

CSS Styles

The CSS file (style.css) defines the styling for the entire landing page. It covers styling for the opening video, header, navigation, features, FAQ, and footer. The styles are responsive, adapting to different screen sizes.

JavaScript Functionality

The JavaScript file (app.js) handles the removal of the opening video after a specified delay (5 seconds). It targets the video element and its parent container, removing them from the DOM to reveal the main content of the page.

Responsive Design

The CSS includes media queries to ensure a responsive design. The layout adjusts for smaller screens, optimizing the user experience on devices like smartphones.

Usage

Open the index.html file in a web browser to view the Netflix India landing page. The responsive design ensures compatibility with various devices.

Feel free to customize and extend this project to meet specific requirements or add additional features. For further development, consider integrating backend functionality for user authentication and subscription management.