Création d'un menu dynamique:

**koKoTis** · 16/07/2012, 16h56

Bonjour, je souhaite créer un menu avec sous menu dynamique.
Le but étant que dès que j'ajoute une page sur mon site, le menu affiche automatiquement le lien sans que j'ai besoin d'ajouter le lien moi-même dans le menu.
Le menu doit lister des pages "index.php" et "index.htm", les pages sont présentes dans des sous-dossiers.

Pour l'instant, j'ai un script PHP qui liste les pages présentes dans des sous-dossiers qui eux sont stockés dans le dossier courant, là où se trouve le script, ce script crée donc des liens dont les textes cliquables sont les noms des sous-dossiers, liens qui pointent vers les fichiers "index.php" présents dans les dossiers.
Voici le script en question:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<?php 
  $directories = glob("*",GLOB_ONLYDIR); 
  foreach ($directories as $dir) 
   { 
      echo '<a href="'.$dir.'/index.php">'.$dir.'</a> <br>&nbsp;'; 
   } 
?>

Donc en fait j'ai plusieurs galeries, donc plusieurs dossiers contenant chacun des sous-dossiers contenants les fichiers "index.php", donc j'ai dans chacun des dossiers sources ce script que j'ai mis ci-haut.
Ce que je voudrais c'est créer un script qui affiche un menu dont les liens parents seraient les noms des dossiers courants, lorsque l'on passerait le curseur de la souris sur un de ces liens un menu contextuel s'afficherait avec d'autres liens qui eux pointeraient vers les fichiers "index.php" contenus dans les sous-dossiers et les textes cliquables de ces liens seraient les noms de ces sous-dossiers.

--------------------

Donc explication en image:

Il y a une liste de dossiers courants:

Ces dossiers seraient les liens parents du menu.

Puis chacun de ces dossiers courants contient une liste de sous-dossiers:

Ces sous dossiers seraient les textes cliquable des liens des menus contextuels.

Ces liens pointeraient vers les fichiers "index.php" contenus dans les sous dossiers:

-------------------

En espérant m'être à peu près bien expliqué, je fais appel à votre savoir-faire.
Quelqu'un peut-il m'aider ?

**Fench** · 17/07/2012, 09h48

Bonjour,

Va voir du côté du jQuery pour les menus déroulants, c'est assez simple pour faire je pense comme tu le désires, il y aura juste la création des menus, sous menus et encore plus bas avec la lecture des répertoires.

Je l'ai déjà fais avec des menus et sous menus

**koKoTis** · 17/07/2012, 09h50

Merci mais je ne veut pas de menu déroulant

**patrickbaras** · 22/07/2012, 09h52

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php 
function dir_scan_html($dir,$niveau=0,$id=0)
{
$html=null;
$html_repertoires=null;
$html_fichiers=null;
	if ($handle = opendir($dir)) {
		while (false !== ($entry = readdir($handle))) {
			$id++;
			if(is_dir($dir."/".$entry))
			{
				if($entry!='..' && $entry!='.')
				{
				 $html_repertoires .= str_repeat("\t",$niveau)."<div id='div_".$id."' style='border:solid 0px #00FF00;' onclick='document.getElementById(\"sub_".$id."\").style.display=\"block\"' onDblclick='document.getElementById(\"sub_".$id."\").style.display=\"none\"'>";
				 $html_repertoires .= str_repeat("<img src='images/vide.png' border='0'>",$niveau);
				 $html_repertoires .= "<img src='images/folder.png' border='0'>";
				 $html_repertoires .= "".$entry."";
				 $html_repertoires .= "";
				 $html_repertoires .= "";
				 $html_repertoires .= str_repeat("\t",$niveau)."</div mid='div_".$id."'>\n";
					//echo ".".$entry."<br>";
				 $niveau++;
				 $html_repertoires .= str_repeat("\t",$niveau)."<div id='sub_".$id."' style='display:none;border:solid 0px #FF0000;' >\n";
				 $html_repertoires .= dir_scan_html($dir."/".$entry,$niveau,$id);
				 $html_repertoires .= str_repeat("\t",$niveau)."</div mid='sub_".$id."'>\n";
				 $niveau--;
				}				
			}else{
				 $html_fichiers .= str_repeat("\t",$niveau)."<div id='fil_".$id."'>";
				 $html_fichiers .= str_repeat("<img src='images/vide.png' border='0'>",$niveau);
				 $html_fichiers .= "<img src='images/file_extension_txt.png' border='0'>";
				 $html_fichiers .= "<a href='".$dir."/".$entry."' target='_blank'>".$entry."</a>";
				 $html_fichiers .= "</div>\n";
					//echo " ".$entry."<br>";
			}
		}
		closedir($handle);
		$html.=$html_repertoires;
		$html.=$html_fichiers;
		return $html;
	}    
}
$html = dir_scan_html(".");
echo $html;
?>

tu met ce code dans l'index.php de ta galerie supérieur
tu crée un sous-répertoire images
tu y met les images : file_extension_txt.png folder.png vide.png
tu obtient quelque chose comme prtscr.png
un click sur le nom du folder montre son contenu
un double click cache le contenu
un click sur un lien fichier ouvre le fichier dans une autre fenêtre

**koKoTis** · 22/07/2012, 10h09

Merci beaucoup

Mais ce n'est pas un menu contextuel si ?

**patrickbaras** · 22/07/2012, 11h54

menu contextuel ? que veux tu dire ?

**koKoTis** · 22/07/2012, 12h46

Ca par exemple c'est un menu contextuel

**patrickbaras** · 23/07/2012, 09h48

rien ne t'empêche de le rendre contextuel, tu le met dans un <div> et l'afficher via javascript sur un event onmouseover.

**koKoTis** · 23/07/2012, 09h49

Envoyé par patrickbaras

rien ne t'empêche de le rendre contextuel, tu le met dans un <div> et l'afficher via javascript sur un event onmouseover.

Merci mais ce n'est pas un div qu'il me faut mais un vrai menu contextuel

Mais merci beaucoup de ton aide

**patrickbaras** · 23/07/2012, 16h44

si tu veux ton menu dans la barre de firefox ce n'est pas "facilement" possible.
je passe la main.
désolé.

**koKoTis** · 23/07/2012, 17h21

Envoyé par patrickbaras

si tu veux ton menu dans la barre de firefox ce n'est pas "facilement" possible.
je passe la main.
désolé.

Non pas dans la barre de firefox, sur le menu de mon site

**kalimukti** · 24/07/2012, 12h34

Envoyé par koKoTis

Non pas dans la barre de firefox, sur le menu de mon site

Bonjour,
Si je suis bien ce que vous recherchez, ça ressemble bien à un menu fait par javascript (côté client) à partir de données établies côté serveur. Seul moyen me semble-t-il de reproduire les menus du genre applications windows.
Cordialement

**koKoTis** · 24/07/2012, 12h35

Merci

Mais commet ?

**kalimukti** · 24/07/2012, 12h44

Envoyé par koKoTis

Merci

Mais commet ?

Vous trouvez un tuto ici, par exemple.
Ou ici, pour les menus déroulants.

Sinon, le menu contextuel: http://jcrozier.developpez.com/tutor...nu-contextuel/

**koKoTis** · 24/07/2012, 13h45

Merci encore

Donc première question, comment faire un sous meu dans les liens de se code ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<ul id="myMenu" class="contextMenu">
    <li class="edit">
        <a href="#edit">Edition</a>
    </li>
    <li class="cut separator">
        <a href="#cut">Couper</a>
    </li>
    <li class="copy">
        <a href="#copy">Copier</a>
    </li>
    <li class="paste">
        <a href="#paste">Coller</a>
    </li>
    <li class="delete">
        <a href="#delete">Supprimer</a>
    </li>
    <li class="quit separator">
        <a href="#quit">Quitter</a>
    </li>
</ul>

**kalimukti** · 27/07/2012, 14h02

Envoyé par koKoTis

Merci encore

Donc première question, comment faire un sous meu dans les liens de se code ?

Bonjour,

le principe générale, c'est de partir sur des <ul> imbriquées, genre:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<ul id="myMenu" class="contextMenu">
    <li class="edit">
        <a href="#edit">Edition</a>
    </li>
    <li class="cut separator">
        <a href="#cut">Couper</a>
    </li>
    <li class="copy">
        <a href="#copy">Copier</a>
    </li>
    <li>
       <ul>
          <li class="paste">
             <a href="#paste">Coller</a>
          </li>
          <li class="delete">
             <a href="#delete">Supprimer</a>
          </li>
          <li class="quit separator">
             <a href="#quit">Quitter</a>
          </li>
       </ul>
    </li>
</ul>

Le plus simple, à mon avis, est de se servir d'un plugin par exemple de Jquery, comme superfish (exemple) qui te permet en quelques lignes de transformer un ensemble de listes imbriquées directement en menu comme tu recherches...
Hope that was usefull

**koKoTis** · 27/07/2012, 14h07

Merci beaucoup

Dans l'exemple que tu m'a donner, ou trouve t-on le fichier hoverIntent.js ?

**patrickbaras** · 27/07/2012, 15h07

reprendre la function que j'ai donné et la simplifier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<?php
function dir_scan_menu($dir,$niveau=0,$id=0)
{
$html=null;
$html_repertoires=null;
$html_fichiers=null;
	if ($handle = opendir($dir)) {
		while (false !== ($entry = readdir($handle))) {
			$id++;
			if(is_dir($dir."/".$entry))
			{
				if($entry!='..' && $entry!='.')
				{
				 $html_repertoires .= "";
				 $html_repertoires .= str_repeat("\t",$niveau)."<li>";
				 $html_repertoires .= "".$entry."";
				 $html_repertoires .= "</li>\n";
				 $html_repertoires .= "";
				 $html_repertoires .= str_repeat("\t",$niveau)."<ul>\n";
				 $niveau++;
				 $html_repertoires .= dir_scan_menu($dir."/".$entry,$niveau,$id);
				 $niveau--;
				 $html_repertoires .= str_repeat("\t",$niveau)."</ul>\n";
				}				
			}else{
				 $html_fichiers .= str_repeat("\t",$niveau)."<li>";
				 $html_fichiers .= "<a href='".$dir."/".$entry."'>".$entry."</a>";
				 $html_fichiers .= "</li>\n";
			}
		}
		closedir($handle);
		$html.=$html_repertoires;
		$html.=$html_fichiers;
		return $html;
	}    
}
$html = dir_scan_menu(".");
echo $html;
?>

ce qui donne

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<li>images</li>
<ul>
	<li><a href='./images/folder.png'>folder.png</a></li>
	<li><a href='./images/prtscr.png'>prtscr.png</a></li>
	<li><a href='./images/vide.png'>vide.png</a></li>
	<li><a href='./images/file_extension_txt.png'>file_extension_txt.png</a></li>
</ul>
<li>test1</li>
<ul>
	<li>test11</li>
	<ul>
		<li><a href='./test1/test11/test1.jpg'>test1.jpg</a></li>
		<li><a href='./test1/test11/test11.jpg'>test11.jpg</a></li>
	</ul>
	<li><a href='./test1/test1.jpg'>test1.jpg</a></li>
</ul>
<li><a href='./exploreur.php'>exploreur.php</a></li>

Création d'un menu dynamique:

Langage PHP

Discussions similaires

Partager

Partager