Hello, I’m not a developer but I would like to help our development team. We have the problem that we should build a footer which is displayed as an accordion on mobile. The problem is not the structure of the whole thing, but that bugs can occur if a user keeps dragging the browser window large and small on the desktop. How can you build the whole thing with as few errors as possible?
I myself am a designer and thought with my amateur knowing that the basis could be an accordion, which displayed all accordions openly via JS in the desktop view and deactivated the click function. The styling is then adjusted using CSS.
Since I’m not a developer, I don’t know what information you need to be able to give me a suitable answer. So ask me what information you need to be able to help me/us.
I have attached a screenshot showing the intended design. The numbers show the order of the accordions.
It’s a question of your CSS on that certain breakpoint, so also relevant, how your markup looks.
So it’s a question of css and styling capabilities. Look into search terms like “media query”, “breakpoint” and read from there, so you get to learn, how to have that element behave differently
Thank you for your quick response.
I know my way around with Mediquerys and Breakpoints. The problem is (as I understand it) that bugs can occur if you make the browser window bigger and smaller more often. Our development hasn’t even started yet, but noted this problem in a preliminary meeting. The development thinks that it would not be so easy to solve. Although I have already done it myself with Wordpress (Biomasse – Nachhaltiger Brennstoff? - Co-Hotel Factory)
The previous solution of our developers would be that we build the footer twice and output the respective footer. The content should be automatically synchronized between the footers.
Then it’s your job, as collegues, to share knowledge and find the best solution, with skillset you have at your hands.
And if that’s the best solution you come up with, with your skillset at hand, that’s the way to go. Update your rendering, so it output what you need, to fullfill it.
But this feels like a talk about skillset you should have with your collegaues
