Page 1 of 1
Section header don't work in ipad
Posted: Wed Feb 16, 2011 5:56 pm
by Recon
Hi,
I have menu where is few drop down menus. First layer of the menu is only section header. This works fine on PC when mouse over the section header, but it doesn't work on ipad... or playStation's browser. This is not actually css problem, because I have attached CMSMS's NCleanBlue's menu and this doesn't work either.
Eny idea?
Re: Section header don't work in ipad
Posted: Thu Feb 17, 2011 6:07 pm
by Recon
Just realize that problem is not the section header, its drop down menu. Any ideas how I can get drop down menu working on ipad?
-Recon
Re: Section header don't work in ipad
Posted: Sat Mar 26, 2011 1:32 pm
by martin42
Hi
I have same problem! What was the solution?
I see your site's working OK now on iPad.
Thanks
- Martin
Re: Section header don't work in ipad
Posted: Sun Sep 25, 2011 9:38 am
by denli
I got i 2!
This is an ugly problem that should be attended to if cmsms doesn't want to lose the tablet boot!
Re: Section header don't work in ipad
Posted: Sun Sep 25, 2011 10:01 am
by martin42
Well, I guess the real problem is that "CSS:Hover" is fundamentally unsafe (because it doesn't really mean anything) for Touch-screen devices. That's not something that CMSMS can really fix.
Yet for some reason I don't really understand, one of my older sites has CSSMenu drop-downs that work on the iPad. But I think I concluded that old site included some Javascript aimed at old (pre-IE6) browsers, so it's a miracle that the navigation still works at all.
For my most recent site, in the end I just designed the navigation so that Hover drop-downs were not needed. I think this is the safest, cleanest answer. As a compromise, you could maybe have a set-up where you have dummy pages containing a second level of CSSMenu navigation that drops down for the Click event, but also you still allow the CSS:Hover event for those devices that implement it. It would be great if CMSMS could automate all that, somehow!
Hope this helps
- Martin
Re: Section header don't work in ipad
Posted: Wed Sep 05, 2012 12:33 pm
by peterbus
Recon,
You say: "it's not the section header" .
I think it is. Only my pages that are marked Sectionheader do not show their submenu's. As soon as I chage it into Content the submenu's work just fine.
So my guess is that there is somthing not ok in the sectionheader "thing".
Re: Section header don't work in ipad
Posted: Wed Sep 05, 2012 12:40 pm
by denli
I made a workaround by making instead of a sectionheader an external link to the sites home page. The only downside is if sombody klicks it they wil go to the home page but this is ok for me for now.
Re: Section header don't work in ipad
Posted: Thu Sep 06, 2012 12:59 am
by Dr.CSS
You can customize the menu template so sectionheader have one of these href= statements in it...
1. <a href="javascript:void(0)">Something</a>
2. <a href="#" onclick="return false;">Something</a>
Re: Section header don't work in ipad
Posted: Wed Sep 12, 2012 12:10 am
by applejack
Take a look at Modernizer to detect if touch device then use jQuery events such as touchstart.
Re: Section header don't work in ipad
Posted: Wed Sep 12, 2012 1:49 am
by carasmo
IOS devices don't have hover, they have click so use a click menu or use this code and add your selector where mine is. It works great. All parent links should be section headers or this will prevent getting to the drop down, so all sites I design all parents are section headers of children and the top link is not a link. On desktop it's a hover, on IOS it's a click.
Code: Select all
// iOS Hover Event Class Fix - http://niteodesign.com/web-design/iphone-ipad-ios-and-the-css-hover-event/
// alternate http://blog.0100.tv/2010/05/fixing-the-hover-event-on-the-ipadiphoneipod/
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
$(".nav li a").click(function(){ // Update class to point at the head of the list
});
}
Re: Section header don't work in ipad
Posted: Wed Sep 12, 2012 1:52 am
by carasmo
as for playstation, then consider rebuilding the menu to be a click menu, just like google's:
http://www.jqueryload.com/jquery-dropdo ... ogle-style