CSS只下拉菜单不喜欢iPad等。按照菜单链接，而不显示菜单 [英] CSS only drop down menu doesn't like iPad etc. Follows menu link without revealing menu

问题描述

我们在这里创建了一个新网站www.worthingleisure.co.uk/splashpoint

We have created a new website here www.worthingleisure.co.uk/splashpoint

它在顶部有一个CSS的菜单，应该工作的iPad，iPhone ，以及其他基于触摸的设备。

It has a CSS only menu at the top that should work the iPad, iPhone, and other touch based devices by using the li:hover ul method with appropriate showing and hiding.

然而，如果你点击设施，它会跟随链接和只会在加载设施页面时立即显示菜单。如果你回来，菜单然后显示精细！

However, if say for example you tap Facilities, it follows the link and only momentarily reveals the menu as it loads the Facilities page. If you hit back, the menu then shows fine! I am sure this used to work fine but has now stopped working.

我画了一个空白，试过一切，使它成为一击打开菜单，第二次点击按照超链接的URL并绘制一个空白，包括在li项目中按照其他地方建议放置onclick ='return false'。

I have drawn a blank and tried everything to get it to be "one tap" opens menu, "second tap" follows URL of hyperlink and drawn a blank, including putting "onclick='return false'" in the li items as suggested elsewhere.

，我一直在寻找这一整天，没有能够找到答案，但其他CSS只菜单工作完全正常，我不能知道他们和我们之间是不同的。

Does anyone have any ideas, I have been looking into this all morning and not been able to find an answer, yet other CSS only menus work perfectly fine and I cannot fathom out what is different between them and ours.

非常感谢，
Vicky

many thanks, Vicky

推荐答案

Ok，所以这是他人说的一个高潮。你可以做iPad上的悬停效果，但它取决于具体情况。它不工作在你的原因是因为设施菜单项也是一个链接。因此，当您按下它时，它会触发悬停和点击（这就是为什么你看到它，当你回到页面）。

Ok so it's kind of a culmination of what others have said. You can do hover effects on iPad but it depends on the situation. The reason why it's not working on yours is because the Facilities menu item is also a link. So when you press it it fires the hover and the click (which is why you see it when you go back to the page).

如果设施是一个跨度并且仍然有正确的CSS悬停，那么它将工作，因为你击中它，但没有击中链接。

If facilities were to be a span and still had the correct CSS hover then it would work since you are hitting it but not hitting a link.

因为你可能想保留那些父类别链接，因为其他人建议你想使用Javascript / jQuery来抑制默认操作（但只适用于触摸事件设备，因为你不会它不能在带鼠标的设备上工作）。

Since you probably want to keep those parent category links as others have suggested you'd want to use Javascript/jQuery to suppress the default action (but only for touch event devices since you wouldn't want it to not work on a device with a mouse).

这篇关于CSS只下拉菜单不喜欢iPad等。按照菜单链接，而不显示菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！