responsive-nav.js
responsive-nav.js copied to clipboard
Is it possible to have clickable parents?
Hi. I'm looking for a solution like SlickNav where you can't clickable parents (of course in addition to being an actual dropdown). Anyone got an idea on how to achieve this?
Let's say I have a menu like this Products
- Hardware
- Software
- Misc
Here I want "Products" to be clickable to its own page. Would be great to have this flexibility wise and of course for SEO as there's more to be indexed.
Thanks.
Hi. I found this thread with a solution, but still can't get it to work. Please see me my comment in that thread:
https://github.com/viljamis/responsive-nav.js/issues/139
#146 Here's the html/css solution
Example on site I used it on http://focus.mudbugmedia.com/
Hi Lindolini. Good work, but on Tablet the parent links go straight to the page, instead of opening the submenu. I guess there should be a "1. click" to open and after an "open" class has been added the click to the page (or so) (similar to zurb/foundation). How could this be done? Thanx.
Hm,
I can think of two things...either...
- Switch to mobile for tablet (lazy solution)
- Use an off-canvas nav solution instead
- Figure the current solution out: It's very tricky because double tap is a zoom feature (at least on iOS...not played with Android to confirm on that). I'm not sure what's the status of that behavior state since it's being hotly debated in the web community (keep it or lose it). The issue starts because of the hover state, which is technically a desktop behavior and is non-existent on touch devices. There used to be a solution where you can utilize a Modernizr feature class, like
.no-touch
, to target the:hover
. But! it is a very unreliable method. This article gives you an idea of how messy it is targeting touch (even if you try Modernizr since they declassed the.touch
and.no-touch
features) http://www.stucox.com/blog/you-cant-detect-a-touchscreen/
NOTE: I think there may be a solution for the tablet size one. I had a fellow front-end buddy figure it out. I'll come back when I can get in touch with him.
Hi, thanx, now as you mention it, FD has also a class not-click on dropdown-items (added, when you configure "is_hover"). It uses "clip" to show and hide them. And he uses modernizr,
if (settings.is_hover && !Modernizr.touch) return;
hope it helps, looking forward to your solution, thanx for your help. Thomas