Responsive Multi-Step Form with Lazy Loading in Vanilla JS
Design comparison
Solution retrospective
This one is tough, especially since I challenged myself to do this without using a framework since this required state management.
Since the data required is fixed (email, plan, etc.), I did not make my own state manager. This uses sessionStorage to get the summary details and save your data on page reload.
To render out stuff, I used querySelector and getElementById methods and giving specific elements with specific attributes a display of none.
I welcome anyone for some feedback regarding how to set up the floating form on the mobile version and if I misused any aria attributes as I strive to aim for accessibility. Enjoy the view! Thanks!
Community feedback
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord