DEV Community

Cover image for Cricket Website Landing Page
Bgguy154
Bgguy154

Posted on

1 1

Cricket Website Landing Page

This is a submission for Frontend Challenge v24.07.24, Glam Up My Markup: Recreation

What We Built
We build a Cricket Website Landing Page with given template HTML Code.On top of that,we added CSS and Javascript to it to make it more Beautiful,interactive and user friendly.

Demo

Below is the deployed Website for you to view:


Also I am adding the images of how it looks and on scrolling,We get Parallax Effect too.

Image description

Image description

Image description

Image description

Journey

We(@bsanika @gayatri_bannagare_a5247aa @aditi_sadhankar_61bf8e1b1 @bgguy154 ) Started to look ways to make the Website more User Friendly and Interactive as well as easy to use ,For that,The first effect we preferred was from CSS that is Parallax effect which changes background as You scroll down in this website.

The next we did to make the Website more interactive is adding images which go front and back through navigating,we used Javascript to implement this .Also we have additional given implementation of Clickable entities.(The logic for this both can be visible in swiper function.

Also a feature that we added is the Hovering effect for Schedule of the tournament.Upon going deep into it,One will definitely be able to use this to redirect the user to an appropriate entity to show details of the match taking place.Apart from that more sections could also be added to it for matches on same day.

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay