https://github.com/basedhound/scroll-animation_js

Landing page featuring a modern scroll animation, built using only HTML, CSS, and JavaScript, without any libraries. This design incorporates smooth, engaging animations, and modern aesthetic.
https://github.com/basedhound/scroll-animation_js

animation css design html javascript js scroll scrolling

Last synced: 11 days ago
JSON representation

Landing page featuring a modern scroll animation, built using only HTML, CSS, and JavaScript, without any libraries. This design incorporates smooth, engaging animations, and modern aesthetic.

• Host: GitHub
• URL: https://github.com/basedhound/scroll-animation_js
• Owner: basedhound
• Created: 2023-11-08T08:05:51.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-08-06T05:02:12.000Z (4 months ago)
• Last Synced: 2024-08-06T07:19:26.231Z (4 months ago)
• Topics: animation, css, design, html, javascript, js, scroll, scrolling
• Language: CSS
• Homepage: https://scroll-animation-fv.netlify.app
• Size: 934 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


    

      

    

  
Scroll Animation - JS



##  
 📋 Table of Contents

- ✨ [Introduction](#introduction)

- ⚙️ [Tech Stack](#tech-stack)

- 🚀 [Quick Start](#quick-start)

##  
 ✨ Introduction

**[EN]** Landing page featuring a modern scroll animation, built using only HTML, CSS, and JavaScript, without any libraries. This design incorporates smooth, engaging animations triggered by scrolling, enhancing user interaction and visual appeal with a clean and contemporary aesthetic.

**[FR]** Page d'accueil avec des animations modernes au défilement, réalisées uniquement en HTML, CSS et JavaScrip, sans utilisation de bibliothèque. Ce design offre des animations fluides et captivantes qui se déclenchent lors du défilement, optimisant l'interaction utilisateur et l'attrait visuel avec une esthétique moderne et épurée.

##  
 ⚙️ Tech Stack

- **HTML** (HyperText Markup Language) is the standard markup language used to create and structure content on the web. It provides the basic building blocks for web pages, defining elements such as headings, paragraphs, images, links, and more. HTML forms the backbone of any web document and is essential for web development.

  

- **CSS** (Cascading Style Sheets) is a stylesheet language used to control the presentation and layout of web pages. It allows developers to apply styles such as colors, fonts, spacing, and positioning to HTML elements. CSS enhances the visual appeal and user experience of a website by enabling the separation of content and design.

  

- **JavaScript** is a versatile programming language that enables interactive and dynamic functionality on web pages. It allows developers to create features like form validation, animations, and asynchronous content loading. JavaScript is essential for building modern web applications and works seamlessly with HTML and CSS to create a complete user experience.

## 
 🚀 Quick Start

Follow these steps to set up the project locally on your machine.


**Prerequisites**

Make sure you have the following installed on your machine:

- [Git](https://git-scm.com/)

- [Node.js](https://nodejs.org/en)

- [npm](https://www.npmjs.com/) (Node Package Manager)


**Cloning the Repository**

```bash

git clone {git remote URL}

```


**Running the Project**

Use [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)

to launch a development local server with live reload feature for static & dynamic pages.****