Join James Williamson for an in-depth discussion in this video Replacing hover styling with touch, part of Applied Responsive Design.
When we start scripting our medium-sized screen function we find ourselves with a little bit of a problem.…While the 481 pixel to 768 pixel screen size generally means tablet or maybe even a large…phone and that generally is going to be touch-enabled, the rise of netbooks and hybrid…laptops means that we really can't take it for granted. And if we are really being honest,…that's probably true of all the screen sizes that we are looking at: we can't tell if it's touch or not.…So with that in mind, we are going to start working on our medium screen function with an…eye towards making it work regardless of whether or not the device is touch-enabled.…
This approach we could actually use also in our large screen and small screen if we…wanted to. I am just showing you a different aspect of how you can start planning for touch-enabled devices.…One of things I want to point out to you really quickly, if I go over to the source code of…index.htm found in the 03_10 folder,…remember, back when we structured this menu, we have a few list items with the class of hover.…
- 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?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
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.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.