Boutons actifs avec Bootstrap 3

Question

Dans ma barre de navigation, je souhaite que mes boutons deviennent actifs (en grisé) lorsque je clique dessus. À l'heure actuelle, je ne peux que les rendre actifs ou non, mais je ne sais pas comment les changer une fois que je clique dessus. J'utilise le nouveau Bootstrap (3.0).

Par exemple:

non actifs

<li><%= link_to "Contact", contact_path %></li> 

active

<li class="active"><%= link_to "About", about_path %></li> 

Je veux qu'il soit actif/non actif selon que la page en cours est sélectionné ou non.

Answer 1

Utilisez le code Javascript.

Exemple avec jQuery:

$('ul li').click(function() { 
    $(this).addClass('active').siblings().removeClass('active'); 
    }); 

DEMO

Ou avec plus bootstrap:

Bootstrap 3 DEMO

Answer 2

Avez-vous loooked à la perle simple navigation?

https://github.com/andi/simple-navigation

Il a cette fonctionnalité intégrée.

Answer 3

si vous utilisez bootstrap vous pouvez écrire des données-bascule = « menu déroulant » par exemple Accueil