Aspect onglet qui reste tant qu'un autre n'est pas cliqué jQuery

Fermé

gintoxic Messages postés 524 Date d'inscription mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 - 19 oct. 2014 à 02:11
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 20 oct. 2014 à 04:18

Bonjour,
je cherche à faire un systeme d'onglet(<li>) dont le background se colore au click et reste coloré tant qu'un autre n'est pas cliqué. et cela pour chaque onglet du menu.
J'ai recherché sur le net mais rien à faire.
Je ne peux visiblement pas utiliser de fonction banale puisqu'il s'agit d'agir sur la page qui va être affichée après le click...
Je fonctionne en Jquery et je n'y arrive pas.

Si vous avez une piste,merci de m'en faire part

cordialement

A voir également:

Aspect onglet qui reste tant qu'un autre n'est pas cliqué jQuery
Rouvrir un onglet fermé - Guide
Mon pc s'allume mais l'écran reste noir - Guide
Onglet privé - Guide
'Pip' n’est pas reconnu en tant que commande interne ✓ - Forum Python
La diapositive s'affiche progressivement en secondes puis reste affichée secondes à l'écran. ✓ - Forum Powerpoint

1 réponse

Réponse 1 / 1

animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
Modifié par animostab le 20/10/2014 à 04:23

Salut

En jquery

$(document).ready(function() {
 $("#menu a").each(function() {
  if (this.href == window.location) {
   $(this).css("background","red");
  };
 }); 
});


$(function () {
    setNavigation();
});

function setNavigation() {
    var path = window.location.pathname;
    path = path.replace(/\/$/, "");
    path = decodeURIComponent(path);

    $("#menu a").each(function () {
        var href = $(this).attr('href');
        if (path.substring(0, href.length) === href) {
            $(this).closest('li').addClass('active');
        }
    });
}

(ici tu dois ajouter dans le css une class active avec le background)
http://jsfiddle.net/DDZNz/

si le href reprend toute l'url il faut utiliser window.location.href

pour le html

<div id="menu">
<ul>
<li><a href="">page</a></li>
<li><a href="">page</a></li>
<li><a href="">page</a></li>
<li><a href="">page</a></li>
</ul>
</div>

voila

Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.

Discussions similaires

Lien phishing android

Live tiktok

"ls" n'est pas reconnu en tant que commande interne ou externe ...

Pip n'est pas reconnu en tant que commande interne

Ma souris fonctionne mais ne clique plus

Discussions similaires

Newsletters