Join James Williamson for an in-depth discussion in this video Resetting menus for large screens, part of Applied Responsive Design.
For the most part, we don't really need to do anything for our dropdown menu on larger screens.…We have a traditional HTML- and CSS-driven dropdown that really doesn't require any scripting…for it to work. And that would be great, except for the fact that we have to account for…users maybe resizing their screens in a way that triggers our menus to move from one of…those smaller states up to a larger one or back down again.…Now in that case, we could end up with added elements and bound click and touch events…that could affect both styling and performance.…
So, in order to make sure that our large screen menu functions properly, we're going to have…to ensure that anything that may have been added by other menu functions is stripped out.…So, we're going to be working in the index.htm file found in 03_11 folder.…I'm just to kind of show you what I'm talking about,…before we start working, I'm going to preview this in my browser. And as you can see, everything is looking okay.…The dropdown menu is working just fine, just hovering over things the way that they are…
- Creating mockups
- Structuring page regions
- Defining default styles and media queries
- Building desktop, tablet, and mobile layouts
- Structuring and styling menus
- Dynamically replacing menus
- Creating a responsive image gallery
- Adding phone functionality
- Testing responsive sites
Skill Level Intermediate
1. Planning Responsive Designs
2. Building Responsive Layouts
3. Responsive Navigation
4. Creating Responsive Media
5. Enhancing Sites for Mobile
6. Managing Resources
Additional resources4m 10s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.