Sujet Précédent Sujet Suivant

Visualiser dans le menu la page sélectionnée

Résolu
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013 - 18 févr. 2013 à 23:07
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 - 20 févr. 2013 à 18:03
Bonsoir à tous.

Le site que j'ai réalisé utilise PHP et javascript. Je précise que je ne connais rien de ces deux langages, leur utilisation ne fut possible que grâce à de judicieux conseils d'internautes et de quelques "trucs" trouvés sur internet. Il subsiste un point que je ne sais pas résoudre : le site comprend un menu (différents sujets) et des sous-menus (différentes pages). Une fonction CSS a:hover modifie l'aspect des sous-menus survolés. Je voudrais que le sous-menu conserve une marque quelconque (déterminée par CSS par exemple) identifiant la page en cours.

La sélection d'une page est faite par la fonction PHP suivante : 



   <?php
      $page = $_GET['page'];
        if (file_exists("pages/$page.php")==TRUE)
           {include("pages/$page.php");}
    else   {include("pages/accueil.php");}
  ?>


Le menu est semblable à ceci : 

<li>[# Sujet]
  
    <li>[index.php?page=page1 Page 1]</li>
    <li>[index.php?page=page2 Page 2]</li>
    <li> ......
  
</li>


Merci d'avance si l'un de vous peut m'apporter la solution.

13 réponses

Réponse 1 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
19 févr. 2013 à 01:26
J'ai été trop vite après mon copier/coller.
Tu dois remplacer ceci : 
*...
<li>[index.php?page=page1 Page 1]</li>
<li>[index.php?page=page2 Page 2]</li>
*...



stéph
3
Réponse 2 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 15:42
oui, mais dans le code source après avoir cliqué sur le lien.
Dans le tag "a", retrouve-t-on l'attribut classe avec en valeur "selected" ? 
*...
<a class="selected" *...


stéph
3
Réponse 3 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 17:34
Salut, ce que tu voudrais est justement en place.
Car si tu ne passes pas avec la souris sur le lien, cela fonctionne.
Donc, il y a du JavaScript qui supprime la classe CSS au passage de la souris (curseur).
Et c'est possible, j'ai constaté que ton menu fonctionnais comme un accordéon.
Ce sont des menus très connu qui se nomme "Accordion".
Et c'est fait avec du JavaScript, la plus part en jQuery.
Je crois que c'est dans cette direction qu'il faut regarder.

stéph
3
Réponse 4 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 17:35
Voir même, trouver une autre solution.
Ne pas faire cela en PHP mais en JavaScript.

stéph
3

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 13
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013
20 févr. 2013 à 17:59
Oui, c'est bien jQuery qui est utilisé pour gérer le dynamisme du menu. Mais je rappelle que, en ce qui concerne son utilisation, je n'ai rien crée (je n'y connais rien !!!), j'ai simplement adapté une application trouvée sur le net.
Maintenant, on peut tout de même identifier la page en cours en passant la souris sur le menu grâce à la classe .selected, utile quand par exemple, comme dans la rubrique "Camino francés 2003", il y a 35 pages ! Donc, je vais ajouter cette classe à mes menus, ce sera déjà un premier pas.
Je te remercie pour le temps que tu m'as consacré.

Amicalement.

Jean
3
Réponse 6 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 18:03
Très bien, c'était avec plaisir.
A bientôt.

stéph
3
Réponse 7 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
18 févr. 2013 à 23:29
Salut, je vais essayer de t'aider avec le peu d'information données dans ton poste. 

<li>[# Sujet]
  
    <li>[index.php?page=page1 Page 1]</li>
    <li>[index.php?page=page2 Page 2]</li>
    <li> ......
  
</li>


Pour le CSS à toi de voir 
a {}
a.selected, 
a:hover, 
a:hover.selected {}


stéph
0
Réponse 8 / 13
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013
20 févr. 2013 à 08:44
Bonjour Stéph,

Grand merci pour cette réponse rapide et désolé de cette réaction tardive.
Désolé aussi de te dire que je n'obtiens pas le résultat souhaité. La modification du menu est la suivante : 
<li>[index.php?page=1998pe/fr/p02_fr De Puno à Cuzco]</li>
<li>[index.php?page=1998pe/fr/p03_fr Carte du trek]</li>

La classe 'selected' a été ajoutée dans le fichier CSS.
Quelles autres informations sur le site souhaiterais-tu avoir pour y voir plus clair ?
Si la visualisation de ce site peut t'aider, vas voir à cette adresse : http://jeandebot.be
Remarque : tous les fichiers sont en htm et non en PHP.

Jean
0
Réponse 9 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 09:37
Bonjour,

Tu as vérifié que $page n'est vide nulle part ?
Pour le voir très facilement, ajoute $page après le libellé du lien comme ceci. 
<li>[index.php?page=1998pe/fr/p02_fr De Puno à Cuzco (<?php echo $page; ?>)]</li>
<li>[index.php?page=1998pe/fr/p03_fr Carte du trek  (<?php echo $page; ?>)]</li>


Comme ceci, tu verras exactement ce que $page retourne et tu copies/colles la valeur dans l'instruction.

stéph
0
Réponse 10 / 13
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013
20 févr. 2013 à 15:34
Bonjour,

Le seul effet de l'ajout de cette instruction est de modifier les libellés du menu qui deviennent :

De Puno à Cuzco (1998pe/fr/p03_fr)
Cuzco (1998pe/fr/p03_fr)

Cela n'affecte pas l'affichage des pages.

Jean
0
Réponse 11 / 13
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013
20 févr. 2013 à 16:16
Oui, voici les 2 <li> où la modification a été apportée :

Sélection de "De Puno à Cuzco" 

<li>[index.php?page=1998pe/fr/p02_fr De Puno à Cuzco]</li>
<li>[index.php?page=1998pe/fr/p03_fr Carte du trek]</li>


Sélection de "Carte du trek" 

<li>[index.php?page=1998pe/fr/p02_fr De Puno à Cuzco]</li>
<li>[index.php?page=1998pe/fr/p03_fr Carte du trek]</li>


Donc je suppose que ce n'est plus qu'une question de CSS ; je vais voir de ce côté.
Je te tiens au courant.
Merci pour l'aide.

Jean
0
Réponse 12 / 13
cs_stay Messages postés 493 Date d'inscription jeudi 7 juillet 2005 Statut Membre Dernière intervention 24 mai 2017 4
20 févr. 2013 à 16:31
Super, avec plaisir.
A plus tard.

PS: n’hésite pas à me demander pour le CSS.

stéph
0
Réponse 13 / 13
bk372295 Messages postés 16 Date d'inscription lundi 1 mai 2006 Statut Membre Dernière intervention 20 février 2013
20 févr. 2013 à 17:02
Voilà : négatif mais !!!

Je crois que le problème ne vient pas du CSS, la classe .selected s'applique bien dès que la page choisie s'affiche mais disparait dès que le pointeur de la souris quitte le menu ce qui n'est pas le but recherché (maitien de la classe tant qu'on navigue sur la page choisie) ; ma supposition est la suivante : la classe .selected s'applique de manière locale, statiquement, tandis que le serveur regénère la page dynamiquement. Ce devrait donc être le serveur qui devrait renvoyer le code HTML avec l'information de classe qui alors, je pense, devrait s'appliquer de manière permanente.

Qu'en penses-tu ?

Jean
0

Discussions similaires

extraire des liens sur une page html
killer113 -
AcideNitros -

21 réponses
menu en c
sebz10 -
decricri62 -

4 réponses
Reload d'une page
jnbrunet -
Anthomicro -

6 réponses
comment créer un sous menu
msi79 -
msi79 -

8 réponses
Obtenir les liens d'une page web
Izidory -
Caribensila -

5 réponses
Rejoignez-nous