Recently we developed a free Bootstrap-based Joomla! module, that turns your Joomla! menus into a nice JavaScript-based accordion. Inspired as we are, we called it Bootstrap Accordion Menu. The module now hits version 1.0.1, completing all the features we wanted to add to it.

Bootstrap-based plus hover-effects

The Twitter Bootstrap framework offers Joomla! 3.0 frontends and backends a solid layout-structure, allowing for extensions to have a more generic look & feel. But Bootstrap also offers a couple slick JavaScript-effects, like the accordion-menu. Our module simply turns a normal Joomla! menu into such an accordion.

But one downside of the Bootstrap accordion-menu is that it expands or collapses a submenu by using a click on the parent-menu. The parent-menu itself however is not clickable, because of this. We have added an extra JavaScript-piece to our bootstrap-module that overcomes this problem: It allows you to expand a submenu by hovering over the parent-item (no click), so that a click can be used to redirect to the link of that parent-item itself. Simple but very effective.

Posted on December 13, 2012

About the author

Author Jisse Reitsma

Jisse Reitsma is the founder of Yireo, extension developer, developer trainer and 3x Magento Master. His passion is for technology and open source. And he loves talking as well.

Sponsor Yireo

Looking for a training in-house?

Let's get to it!

We don't write too commercial stuff, we focus on the technology (which we love) and we regularly come up with innovative solutions. Via our newsletter, you can keep yourself up to date on all of this coolness. Subscribing only takes seconds.

Do not miss out on what we say

This will be the most interesting spam you have ever read

We don't write too commercial stuff, we focus on the technology (which we love) and we regularly come up with innovative solutions. Via our newsletter, you can keep yourself up to date on all of this coolness. Subscribing only takes seconds.