Bonjour a toutes et tous,
je voulais savoir si quelqu'un pouvait m'aider à faire un menu en PHP/SQL comme celui-ci :
http://css.developpez.com/galerie/demo/menus/verticalderoulant2/#[/url]
En récupérant les titres "menu1","menu1",etc. à partir d'une SGBD SQL et les sous-menu également.
J'ai des notions en php/sql, il me faudrait juste un petit coup de pouce s'il vous plait.
J'ai deux tables comme cela :
Elles contiennent les données suivantes :
J'ai trois fichiers.
Un fichier appelé [u]functions.js[/u] qui contient la fonction pour le menu :
Un fichier nommé [u]style.css[/u] qui contient les styles pour le menu :
La page sur laquelle j'appelle le menu dynamiquement ainsi que les fichiers "functions.js" et "style.css" :
Puis, le fichier du menu :
Pour l'instant, le résultat n'est pas terrible comme vous pourrez le constater, toutes les apparaissent, mais le menu ne fonctionne pas :
http://www.la-grange-sardieres.fr/site Fab/presentation.php
Je voudrai le même résultat que le menu pris en exemple, mais dans ce que j'ai fait il y a quelque chose qui ne va pas.
Merci beaucoup pour votre aide.
Modifié par quaresma (20 Oct 2010 - 22:55)
je voulais savoir si quelqu'un pouvait m'aider à faire un menu en PHP/SQL comme celui-ci :
http://css.developpez.com/galerie/demo/menus/verticalderoulant2/#[/url]En récupérant les titres "menu1","menu1",etc. à partir d'une SGBD SQL et les sous-menu également.
J'ai des notions en php/sql, il me faudrait juste un petit coup de pouce s'il vous plait.
J'ai deux tables comme cela :
CREATE TABLE rubrique (numrubrique INT not null, nomrubrique VARCHAR (20) NOT NULL, PRIMARY KEY (numrubrique));
CREATE TABLE ss_rubrique (numssrubrique INT not null AUTO_INCREMENT, nomssrubrique VARCHAR (40) NOT NULL, photossrubrique VARCHAR (40), numrubrique INT not null, PRIMARY KEY (numssrubrique));Elles contiennent les données suivantes :
INSERT INTO rubrique (numrubrique, nomrubrique) VALUES ("1", "écrits"), ("2", "scènes"), ("3", "+"), ("4", "Actualités"), ("5", "biographie");;
INSERT INTO ss_rubrique (numssrubrique, nomssrubrique, photossrubrique, numrubrique) VALUES ("1", "théâtre", "fototheatre.gif", "1"), ("2", "enfance et jeunesse", "fotoenfance.gif", "1"), ("3", "poésie", "fototheatre.gif", "1"), ("4", "traduction", "fototraduction.gif", "1"), ("5", "autres publications", "fotoautrespubli.gif", "1"), ("6", "saison 2010-2011", "fotosaison201011.gif", "2"), ("7", "saison 2009-2010", "fotosaison200910.gif", "2"), ("8", "archives", "fotoarchive.gif", "2");J'ai trois fichiers.
Un fichier appelé [u]functions.js[/u] qui contient la fonction pour le menu :
function afficheMenu(obj){
var idMenu = obj.id;
var idSousMenu = 'sous' + idMenu;
var sousMenu = document.getElementById(idSousMenu);
/*****************************************************/
/** on cache tous les sous-menus pour n'afficher **/
/** que celui dont le menu correspondant est cliqué **/
/** où 4 correspond au nombre de sous-menus **/
/*****************************************************/
for(var i = 1; i <= 20; i++){
if(document.getElementById('sousmenu' + i) && document.getElementById('sousmenu' + i) != sousMenu){
document.getElementById('sousmenu' + i).style.display = "none";
}
}
if(sousMenu){
//alert(sousMenu.style.display);
if(sousMenu.style.display == "block"){
sousMenu.style.display = "none";
}
else{
sousMenu.style.display = "block";
}
}
}Un fichier nommé [u]style.css[/u] qui contient les styles pour le menu :
*{
margin:0;
padding:0;
}
#menu{
width:150px;
margin:20px auto 0 auto;
}
.menu, .sousmenu{
text-align:center;
}
.menu{
height:18px;
width:150px;
padding:2px 0;
background:#404040;
color:#fff;
}
.sousmenu{
height:18px;
width:150px;
padding:1px 0;
background:#808080;
color:#fff;
}
.menu a{
display:block;
width:100%;
height:100%;
color:#fff;
font-family:arial,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
background:#404040;
}
.sousmenu a{
display:block;
width:100%;
height:100%;
color:#123456;
font-family:arial,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
}
.menu a:hover, .sousmenu a:hover, .menu a:active, .sousmenu a:active, .menu a:focus, .sousmenu a:focus{
color:#654321;
}La page sur laquelle j'appelle le menu dynamiquement ainsi que les fichiers "functions.js" et "style.css" :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content=" />
<meta name="description" content=" />
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="menu/style.css" type="text/css" />
<script type="text/javascript" src="menu/functions.js"></script>
</head>
<body>
<table width="900" height="421" border="0" align="center" bgcolor="#000000">
<tr>
<td width="22"> </td>
<td width="145" valign="top"><br />
<?php include"menu/menu.php" ?>; </td>
<td width="682" valign="top"><br />Puis, le fichier du menu :
<?php
require("identification/connexion_sql.php");
$db = mysql_connect($host_db,$login_db,$password_db) or die ("impossible de se connecter a la base".mysql_error());
mysql_select_db($name_db,$db) or die ("base inexistante".mysql_error());
$req = mysql_query("SELECT * FROM rubrique, ss_rubrique WHERE ss_rubrique.numrubrique = rubrique.numrubrique ORDER BY rubrique.numrubrique ASC, ss_rubrique.numssrubrique") or die ("impossible d'effectuer la requête");
$arrayFlag = array();
print'<div id="menu">';
while($shopone = mysql_fetch_array($req)){
$nomrubrique = stripslashes($shopone['nomrubrique']);
$nomssrubrique = stripslashes($shopone['nomssrubrique']);
$nomrubrique2 = utf8_encode($nomrubrique);
$nomssrubrique2 = utf8_encode($nomssrubrique);
if( !isset($arrayFlag[$shopone['numrubrique']])) // On vérifie que le champ n'a pas été déjà affiché
{
print'
<div class="menu" id="menu'.$shopone['numrubrique'].'" onclick="afficheMenu(this)">
<a href="#">'.$nomrubrique2.'</a>
</div>';
$arrayFlag[$shopone['numrubrique']] = true;} // On signale qu'on a affiché cette catégorie au moins une fois
if( !isset($arrayFlag[$shopone['numrubrique']])) // On vérifie que le champ n'a pas été déjà affiché
{
print'<div id="sousmenu'.$shopone['numrubrique'].'" style="display:none">
<div class="sousmenu">
<a href="#">'.$nomssrubrique2.'</a>
</div>';
}else{
print'<div class="sousmenu">
<a href="#">'.$nomssrubrique2.'</a>
</div>';
}
}
print'</div>';
mysql_close();
?>
Pour l'instant, le résultat n'est pas terrible comme vous pourrez le constater, toutes les apparaissent, mais le menu ne fonctionne pas :
http://www.la-grange-sardieres.fr/site Fab/presentation.php
Je voudrai le même résultat que le menu pris en exemple, mais dans ce que j'ai fait il y a quelque chose qui ne va pas.
Merci beaucoup pour votre aide.
Modifié par quaresma (20 Oct 2010 - 22:55)
