javascript - 如何在移动设备上取消悬停元素

Question

我有一个在桌面上运行良好的下拉元素。 http://www.c-testing.nl/werkenbijvanaarsen/growing-together/

但在移动设备上，再次点击时下拉菜单不会收起。我在这个论坛上阅读了一些答案，但在这种情况下似乎不起作用。

我试图只用 css 来实现这一点，但我读得越多，似乎在线 javascript 就可以实现它。

有谁知道我如何在这个元素上设置类似取消悬停的东西？

.pl-drop_down:hover ul {
不透明度:1；
visibility :可见；
}

最好的问候，马克

Answer 1

仅使用 CSS :hover 不太可能获得所需内容，因为它不是为触摸屏设计的。

要让它在移动设备上折叠起来，您可以添加 javascript:

$('[你想要点击的选择器]').click(function() {
$('.pl-drop_down').css({'pointer-events': 'none'});
});

这将删除移动设备上的悬停状态，并应使其折叠起来，不过您需要 jQuery 才能使此解决方案正常工作。