Jumping to parent menu item when clicking caret to close submenu

[caramaple]

Hi there,

I integrated SmartMenus with Bootstrap/WordPress – it all works great, but when I click the caret (which is the a::after) to close the submenu again, it closes the submenu, but also links/jumps directly to the parent page instead of only toggling the submenu.

If I click not right on the caret, but anywhere out of the link area it closes/toggles the submenu without any problems.

For any insights how to solve the problem, I would be very grateful!

[admin]

Hi,

If you are using the Bootstrap addon, you need to use <span class="caret"></span> inside the parent item links for the carets and then it should work fine. Because when you add the carets via CSS with a::after the script cannot differentiate between a click on the link and the caret pseudo element.

Cheers!

[caramaple]

Thanks so much for your answer! Yes, I read about this in your tutorial section “Upgrading SmartMenus jQuery + Bootstrap add-on”.

Yet, I am using the Bootstrap addon with WordPress, so I am not quite sure where to place the <span>. Do you know of any site where SmartMenus is integrated with Bootstrap and WordPress, so I could have a look?

I tried to append the <span> with jQuery, but then the same happens, – clicking on the minus to close the sub-menu links to the parent page. Only if I clock outside the a, then it closes.

Happy for any other hints 😉 – thanks!

[caramaple]

So, I integrated a custom navwalker (https://github.com/twittem/wp-bootstrap-navwalker) and got it working!

[Author]

Posts