joomla中的可点击下拉菜单

Question

我有CSS（HTML）水平菜单，一切正常，但当我用鼠标触摸其中一个菜单“ 列表 ”出现，但我想让它可点击。

我几乎尝试了这一行中的所有内容：

.main-nav-ul li:hover ul {
    display: block;
}

但没有成功......我正在使用Joomla和自定义HTML CSS Javascript模块。
我用这个代码：

https://github.com/shahbokhari/webdev/blob/master/Vertical-Drop-Down-Navigation-2015%202/vertical-drop-down-navigation-using-html-css-2015.html

我想点击ЧАСТИЗАLEDТАБЕЛИ时能够看到此类别中的子菜单。

Answer 1

使用css，您只能处理悬停（鼠标输入和鼠标输出）。 处理点击你应该使用javascript：

$('.main-nav-ul li').click((e)=>{
  $(e.target).closest('li').toggleClass('toggled');
});

当它被点击时，它将切换（添加/删除） toggled的li元素类。

然后你应该替换li:hover到css中的li.toggled ，以便在li切换类时应用切换样式。

你可以在codepen中看到这个