From the course: Creating a Responsive Web Design
Unlock this course with a free trial
Join today to access over 24,000 courses taught by industry experts.
Device compatibility options for nav - CSS Tutorial
From the course: Creating a Responsive Web Design
Device compatibility options for nav
- So now that we have a fully working navigation system built with CSS, there are a few considerations that we'll want to take a look at, when we start considering what will happen on touch devices. If you use this menu system on an Android device, then Touchstart will activate the hover. However, if the top level link is linked to an actual URL, or any other page, the Android device will activate the submenu, but then it will immediately navigate away to the final page. So, if you want to support submenus on the Android platform, and allow people to select those with touch, make sure that the top level item is linked to a pound sign, or a hash symbol, which is a self-link. That way the Android browser won't navigate away, and then somebody can make a secondary choice. This would also need to be the case for "Sub Link 3", under "Design Center", since that has a submenu as well. On the iOS platform, Touchstart also activates a hover, just like on Android. However, if you tap the link a…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.