28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je cherche désespérement à créer un menu à onglet en CSS.
J'utilise pour l'instant les pseudo classes a:link, a:visited, a:hover et a:active.
l'ensemble fonctionne, à l'exception du fait que je souhaite que mon onglet (donc mon lien), une fois cliqué, reste sur l'apparence que je lui ai attribué avec a:active, et ce jusqu'à ce que je clique sur un autre onglet (qui devrait se comporter de la même manière).
Malheureusement, a:active correspondant au click de la souris, mais perd le focus dès que le click ets relaché. C'est alors a:visited qui prends le relai... Smiley decu

J'ai essayé avec un script Javascrit que j'ai glanné sur le web, qui garde bien l'aspect de mon onglet actif, mais qui rend le href son effet (plus aucun lien actif en terme de destination ! le comble pour un menu...) Smiley ohwell

Ce problème est réellement bloquant pour moi, je ne sais plus quoi faire... Smiley bawling
S'il vous plait !
Bonjour,

pour faire cela, tu dois parvenir à différencier les liens actifs sur les pages. Il faut te débrouiller pour que l'onglet correspondant à la page active porte toujours la classe actif, par exemple, ce qui te permettra d'y accéder et de le styler indépendamment des autres en CSS.
Merci pour ta réponse

En fait, c'est ce que fait le script Javascript dont je parlais : il change la classe de mon lien qui vient d'être cliqué, et se faisant, il appelle une autre image. Et cela fonctionne.

Le problème c'est que le href n'est plus actif avec ce script (je ne sais pas pourquoi) et que le clic sur l'onglet n'a d'autre effet que de changer son aspect...

C'est vraiment un problème !
Bonjour kaly.joly,

Quelques lignes de code html, le javascript en question, bref, si tu as une page en ligne, cela aiderait sans doute à t'aider Smiley cligne

Cdt,
Sylvain
Bonjour,

Si tu ne sais pas utiliser ce script correctement (par exemple si tu n'as pas de bases de Javascript), ne l'utilises tout simplement pas. Tu pourras alors te rabattre sur la solution «classique» d'avoir une classe "actif" (ou autre) sur le ou les liens (ou les li) correspondant à la page en cours, à la rubrique en cours, etc.
Bonjour à tous,
merci de me répondre.

Sylvain,
tu peux trouver le site que je suis en train de redévelopper à cette adresse :

http://www.montaudran.org/__v2/accueil.php
http://www.montaudran.org/__v2/css/styles_2.css
http://www.montaudran.org/__v2/js/active.js

comment je procède :
la page d'acceuil est faite de div, celui qui me préoccupe est le deuxième, qui contient le menu à onglet.

- Les onglets à l'état normal sont issu d'une seule image en background appelé par le CSS.
- Les roll-overs de ces onglets correspondent à une liste, le CSS appelle une image en background avec la pseudo classe a:hover.
- Les onglets à l'état actif sont supportés par la même liste, une autre image en background et la pseudo classe a:active.

- Le script js doit permettre de changer la classe du lien actif dans la liste par le biais de son id, et ce faisant, de changer l'image en background.

J'espère que j'ai pu être assez claire, je débute Smiley smile
Merci !
Bonjour,

Ton script active.js ne sert à rien (je peux détailler si besoin mais sinon crois-moi sur parole Smiley cligne ). Tu peux le supprimer et chercher une solution côté PHP (comment faire pour avoir dans mon menu une classe "encours" ou quelque chose du genre sur le bon lien ou le bon li uniquement?).

Ça devrait être très simple à gérer. Pour chaque item du menu, tu testes en PHP si la valeur de $GET_['page'] correspond à l'item en cours, et si oui echo ' class="encours"' et voilà.