I've created a website using Drupal 7. The main navigation uses Superfish and has sub-navigation. I'm also using a jQuery mobile plugin/theme for mobile.
The problem I am having is that on the desktop version, the Superfish navigation has links have sub-navigation but once it's picked up on mobile, the formatting is all messed up. So, I have the Superfish navigation de-activated for mobile and have the non-Superfish main navigation activated. So now, when the mobile version loads: there's no sub-navigation and the links that used to only have hover states are now active.
DESKTOP:
Main link 1 (hover)
- sub link a (click)
- sub link b (click)
MOBILE (problem listed below):
Main link 1 (click) - this goes to a page that has no content
- sub link a (click) - can't access these unless I place the link on the Main link 1 page
- sub link b (click) - can't access these unless I place the link on the Main link 1 page
I'm trying to allow the user to access the navigation in a similar way as Superfish but on mobile.
Currently, I have a module that detects mobile devices and displays an alternate theme (jQuery mobile theme)
Is there a mobile navigation module that will eliminate the need for the Superfish dropdown or work in conjunction with Superfish?
Any help is greatly appreciated.
Comments
I'm using superfish on mobile
I'm using superfish on mobile versions just fine.
If you use a responsive theme you'll be able to tweak the menu css on the 'mobile css file' without affecting the desktop version.
Alternatively, maybe you'll find these useful:
http://css-tricks.com/convert-menu-to-dropdown/
http://mattkersley.com/demos/responsive_menu/ (view source to get to the jquery code)
Also, why don't you add some
Also, why don't you add some content to your blank pages that will serve as an intro to the sub-pages?
It's not good to have blank pages on your website anyway.