Forum d'entraide PHPFrance

Bonjour,

J'ai une carte fixe sur laquelle j'aimerai ajouter une image sur différentes positions, qui varient. Actuellement, je génére une nouvelle image à la volée en PHP pour incorporer les petites images dans la grande.

Le problème, c'est que la grande image est assez grande (a peu près 2000*2000). Comme elle est générée à la volée, on ne peut pas la mettre en cache. Y a t il un moyen de rajouter en HTML les petites images par dessus la grande, sachant que j'utilise en plus un map pour avoir des liens ?

Un exemple de piste :

Code XHTML

Code : Tout sélectionner

<div id="superposition">
  <img src="chemin-de-ton-enorme-image.jpg" alt="Ton énorme image" />
  <img id="petite-image-1" class="petite-image" src="chemin-de-ta-petite-image-1.jpg alt="Petite image 1" />
  <img id="petite-image-2" class="petite-image" src="chemin-de-ta-petite-image-2.jpg alt="Petite image 2" />
  <img id="petite-image-3" class="petite-image" src="chemin-de-ta-petite-image-3.jpg alt="Petite image 3" />
</div>

CSS

Code : Tout sélectionner

#superposition {
  position: relative;
}
/* L'ensemble des petites images est positionné par rapport au div parent */
.petite-image {
  position: absolute;
}
/* Avec les id, on peut jongler avec le positionnement précis de chaque image */
#petite-image-1 {
  top: 0;
  left: 0;
}
#petite-image-2 {
  top: 200px;
  right: 0;
}
#petite-image-3 {
  bottom: 0;
  left: 0;
}

J'ai quelques petits problèmes. D'une part, je perd le lien associé à la zone et les actions javascripts. Enfin, je peux faire doublon, même si c'est pas trop propre. Mon gros problème est que l'image est plus grande que l'égrand, et qu'avec un poisitionnement relative, je perd les barres de défilements sur IE. Y a t il un moyen de forcer leur présence ?

EDIT : En fait, ca marche, je ne sais pas pourquoi ca marchait pas avant...

Enfin, je me retrouve toujours à faire quelque chose d'un peu sale, à superposer une image un map, une image et un autre map... N'y a t il pas moyen d'intercaller l'image entre la grosse image et le map ?

Forum d'entraide PHPFrance

Positioner des images sur une autre image

Positioner des images sur une autre image