Menu Mobile - HTML, CSS e JavaScript

Published: 01 January 1970
on channel: Origamid

188,312

8.7k

Tutorial showing how to create a main menu structure, using a "hamburger" menu on mobile and making it accessible. Completely from scratch with HTML, CSS, and JavaScript

00:00 Project
00:12 HTML Desktop
01:21 CSS Desktop
05:35 Mobile Menu
05:56 HTML Mobile
06:18 CSS Mobile and Media Queries
07:50 JavaScript Mobile
09:50 CSS Dropdown
14:00 Transition
16:58 Hamburger Button
24:33 Touchstart (UX)
26:40 Accessibility (ARIA)
31:32 VoiceOver Test
32:50 Tool

Files
https://github.com/origamid/publico/t...

Example:
https://origamid.github.io/publico/me...

Tool Used
https://www.code.origamid.dev/

Origamid Courses
https://www.origamid.com/cursos/

In In UX Design terms, remember, what's hidden is always less used than what's visible on the screen. So the mobile menu comes with its own set of problems.

On this page of the site you can watch the video online Menu Mobile - HTML, CSS e JavaScript with a duration of hours minute second in good quality, which was uploaded by the user Origamid 01 January 1970, share the link with friends and acquaintances, this video has already been watched 188,312 times on youtube and it was liked by 8.7 thousand viewers. Enjoy your viewing!

12,487

385