Hi, is there any way to change ARI Ext Menu hovering to mouse click instead? I have many menu items till it has two lines on the UI so when I hover the first line, its dropdown appeared behind the 1st level of menu so I can't choose the menu items on the back!
Please help!

Hello,

The extension doesn't support this ability (mouse click is used only for mobile devices). If you send a link to a page where the problem occurs, we can try to fix it via custom CSS rules.

Regards,
ARI Soft

It is probably possible to change the javascript settings from some kind of "onHover" to "onClick".. but not sure.

The submenus appearing behind the parent items can be fixed by adding a higher z-index value to the ul > li > ul items than the parent ul items have.

Hello,

I tried to play around the css file called menu.min.css in modules\mod_ariextmenu\mod_ariextmenu\js\css folder, but however I changed something, it doesn't appear on the UI.
Any way that I can change the css file? It's still in my localhost so I can't provide the link.
However, I provide image that I said before that the submenu appeared behind the root menu. I tried to change the Z Index, but it seems it isn't the correct css file to be changed. Please help!

I managed to reproduce your issue.


First reinstall the mod_Ariextmenu to revert it back to its default settings. You will keep your menu items as they are part of joomla.


Then add the following css code to your own custom css document. You should always add custom code to your own documents because if you ever decide to update the module it will wipe your code and replace it with the default codes.




!important will override the pre-written z-index css rule for the li items in the sub menu. The default z-index value for the ul item is 9999 (or actually the div element containing the ari ext menu), so it needs to be higher.

I also added top: -1px; to prevent it from disappearing when trying to select the sub items.

If you aren't already familiar with tracing code, it is definitely worth learning it. You can right-click any element on a website and select "inspect element". You can then change / add / deactivate code in the browser to preview how it will affect your site before adding it to your css document.

Hope that helps to solve your issue, if not please continue asking

We can investigate the problem when you site will be available online.

Regards,
ARI Soft