Superposition de différents éléments HTML

Version imprimable

15/04/2008, 18h58
b_e_n_n

Superposition de différents éléments HTML

Bonjour,
je suis en train de développer un site web pour une action professionnelle.
Je vous décris ce que j'ai fait : j'ai une image mappée(avec des liens) que j'ai enregistrée en tant qu'index.
Il se trouve que je souhaiterais utiliser cette image mappée en tant qu'image de fond pour toutes mes autres pages.
J'ai essayé de faire un "include("index.html") pour pouvoir integrer cette page à une autre page php mais le problème qui se pose est que les 2pages ne sont pas superposées comme je le souhaitais mais affichées a la suite !!
c'est un réel problème pouvez vous m'aider s'il vous plait je dois terminer ce projet pr demain :s :s :s
merci beaucoup d'avance
15/04/2008, 19h24
hellspawn_ludo

Bonjour et bienvenue à toi sur le forum.

Pourrais-tu mettre du code ou donner le lien qui nous permettrait de visualiser ton problème ?

Merci.

voici la page menu.html :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 <html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>
 
<body>
 
<p><map name="FPMap0">
<area href="index.html" shape="polygon" coords="376, 192, 373, 182, 541, 146, 546, 192">
<area href="nouveautes.php" shape="polygon" coords="550, 194, 543, 124, 703, 125, 706, 189">
<area href="ListeLivres.php" shape="polygon" coords="709, 193, 711, 127, 893, 143, 883, 192">
<area href="contact.php" shape="polygon" coords="893, 194, 911, 131, 1107, 187, 897, 192">
<area href="http://" shape="polygon" coords="1256, 771, 1238, 745, 1214, 724, 1177, 712, 1167, 722, 1175, 739, 1183, 745, 1198, 812, 1206, 820, 1221, 819, 1218, 828, 1219, 838, 1241, 844, 1269, 852, 1295, 858, 1314, 872, 1330, 872, 1330, 856, 1316, 830, 1299, 812, 1284, 792, 1270, 780, 1271, 769, 1269, 764">
</map>
<img border="0" src="images/livre..jpg" width="1360" height="1020" usemap="#FPMap0"></p>
 
</body>
 
</html>

et une des autres pages a laquelle je souhaiterais ajouter menu.html(l'image mappée) en image de fond : (c'est une liste de livres récupérée a partir d'une base de données)

Code:

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
      <html>
  <body>
    <h2>Liste des Articles</h2>
 
<?
 
 
      include("Connexion.php");
      include("menu.html");
      // Exécution de la requête SQL
      $Requête="Select * from Livres" ;
      $Résultat=mysql_query($Requête);
      //Parcours séquentiel du résultat de la requête SQL
      $Ligne=mysql_fetch_array($Résultat);
      while ($Ligne)
        { echo "<a href='AfficheDetailLivre.php?rl=" .
          $Ligne["RefLivre"] . "'>" .
          $Ligne["NomLivre"] . "</a><br>" ;
          $Ligne=mysql_fetch_array($Résultat);
        }
 
 
 
    ?>
  </body>
</html>

Merci pour le code.

Je te montre un exemple avec une simple balise P qui s'affiche au dessus de l'image mappée pour que tu ai une idée. Ainsi, les liens sur ton image sont toujours cliquables :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
 
 <html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>
 
<body>
 
<p><map name="FPMap0">
<area href="index.html" shape="polygon" coords="376, 192, 373, 182, 541, 146, 546, 192">
<area href="nouveautes.php" shape="polygon" coords="550, 194, 543, 124, 703, 125, 706, 189">
<area href="ListeLivres.php" shape="polygon" coords="709, 193, 711, 127, 893, 143, 883, 192">
<area href="contact.php" shape="polygon" coords="893, 194, 911, 131, 1107, 187, 897, 192">
<area href="http://" shape="polygon" coords="1256, 771, 1238, 745, 1214, 724, 1177, 712, 1167, 722, 1175, 739, 1183, 745, 1198, 812, 1206, 820, 1221, 819, 1218, 828, 1219, 838, 1241, 844, 1269, 852, 1295, 858, 1314, 872, 1330, 872, 1330, 856, 1316, 830, 1299, 812, 1284, 792, 1270, 780, 1271, 769, 1269, 764">
</map>
<img border="0" src="images/livre.jpg" width="1360" height="1020" usemap="#FPMap0"></p>
 
<p style=" position:absolute;left:100px;top:200px;background-color:green; color:red; ">Un texte au dessus de l'image mappée</p>
</body>
 
</html>

Dis-moi si ça t'aide.

Pour le résultat de ta requête, tu l'as mets dans une balise P et tu lui donne une position:absolute et tu joues avec le left, top... pour positionner le résultat dans ta page.

P.S. : Fais attention, tu as mis 2 points sur ton lien livre :

Code:

1
2
<img border="0" src="images/livre..jpg" width="1360" height="1020" usemap="#FPMap0">

20/04/2008, 21h05
b_e_n_n

ca ne marche pas pour afficher la requete sur l'image parce que c'est l'image mappéee que je fais include a la page de requete