web-dev-qa-db-fra.com

Éléments de menu Joomla en div cliquable

Je travaille sur la personnalisation du menu Joomla comme une petite expérience pour voir comment je peux le personnaliser. Cependant, maintenant que j'ai transformé chaque élément de menu en un bouton modifiable, j'ai décidé de les changer de UL/LI à DIV.

Le problème, c’est que j’utilise la valeur par défaut mod_menu, et là-dedans, vous ne travaillez pas vraiment avec <a href... ou quoi que ce soit, et donc lorsque je transforme les liens en div, seul le texte dans le div est cliquable plutôt que le div en entier.

Cela a l'air bien, et ça fait presque ce que je veux, mais la priorité principale est que toute la div contenant le lien d'un article agisse comme un bouton, sur lequel je peux cliquer pour aller à cette page.

Est-ce que quelqu'un a une idée de comment faire?

joomla-2.5modulemenu
2
Hocho

Juste pour clarifier, ne supprimez pas du tout la balise <a>, Car elle contient les liens href. Si vous la supprimez, vous devrez recourir à quelque chose comme jQuery.

En supposant par exemple que vous ayez le balisage suivant pour un menu:

<div class="menu">
    <div class="item">
        <a href="#">Home</a>
    </div>
    <div class="item">
        <a href="#">About</a>
    </div>
    <div class="item">
        <a href="#">Contact</a>
    </div>
</div>

Actuellement, le texte est la seule chose cliquable car la balise <a> Par défaut est display: inline;

Donc tout ce que vous avez à faire est d'utiliser les CSS suivants:

.menu .item a {
    display: block;
}

Cela étend essentiellement l'élément à toutes les dimensions de son parent.

1
Lodder