https://github.com/yashi-singh-1/ferris-wheel-using-html-and-css

This project, inspired by the FreeCodeCamp curriculum, showcases the implementation of CSS animations to create an engaging Ferris wheel effect on a webpage. By leveraging CSS animation techniques, elements are transformed and animated to draw attention to specific sections, enhancing the overall user experience.
https://github.com/yashi-singh-1/ferris-wheel-using-html-and-css

css-animation css-animations css-transforms css3 ferris-wheel freecodecamp freecodecamp-project front-end front-end-development frontend html-css-project html5 interactive-web open-source tutorial user-engagement web-design web-development

Last synced: 7 months ago
JSON representation

This project, inspired by the FreeCodeCamp curriculum, showcases the implementation of CSS animations to create an engaging Ferris wheel effect on a webpage. By leveraging CSS animation techniques, elements are transformed and animated to draw attention to specific sections, enhancing the overall user experience.

• Host: GitHub
• URL: https://github.com/yashi-singh-1/ferris-wheel-using-html-and-css
• Owner: Yashi-Singh-1
• Created: 2024-06-05T12:01:50.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-06-05T12:40:36.000Z (over 1 year ago)
• Last Synced: 2024-11-10T11:15:32.082Z (11 months ago)
• Topics: css-animation, css-animations, css-transforms, css3, ferris-wheel, freecodecamp, freecodecamp-project, front-end, front-end-development, frontend, html-css-project, html5, interactive-web, open-source, tutorial, user-engagement, web-design, web-development
• Language: CSS
• Homepage:
• Size: 15.6 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Ferris Wheel Project

This project, inspired by the FreeCodeCamp curriculum, demonstrates the implementation of CSS animations to create an engaging Ferris wheel effect on a webpage. By leveraging CSS animation techniques, elements are transformed and animated to draw attention to specific sections, enhancing the overall user experience.

## Demo 

[![Ferris Wheel Demo Video](demo.png)]([demo.mp4](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-animation-by-building-a-ferris-wheel/step-29))

## Key Features

- Utilizes CSS animations for dynamic element transformations.

- Demonstrates the use of CSS to create engaging visual effects.

- Enhances webpage interactivity and engagement through animation.

## Technologies Used

- HTML5

- CSS3

## How to Use

1. Clone the repository to your local machine.

2. Open the `index.html` file in a web browser to view the Ferris wheel effect.

## Contributing

Contributions are welcome! If you'd like to contribute to further improvements or add new features, feel free to submit a pull request.