Off Canvas Visualization Quiz – Responsive Web Design Fundamentals


So, you just learned how
to make a hamburger menu, which is pretty darn cool. So I want you to think
about what that means for your site layouts and transitions. I want you to pretend that
you’re developing a website, with an off canvas navigation menu. When the user clicks
on the hamburger icon, a nav element should show up
alongside some main content. On mobile viewports though, the nav isn’t going to be visible, until
the user actually makes that click. Take a look at the CSS here, which handles the nav menu’s transition,
from hidden to visible. This open class,
is going to be applied on click, which means when the user
clicks on the hamburger menu. This class will be applied. Which of the following four diagrams,
accurately shows what’s going on? In them,
the gray box represents the viewpoint. The bluish,
purplish box represents an odd menu. And of course,
there’s site content inside. So, pick the diagram,
best represented by the CSS here.

Add a Comment

Your email address will not be published. Required fields are marked *