Superposition d'image et fond cliquable

Superposition d'image et fond cliquable - HTML/CSS - Programmation

Marsh Posté le 12-06-2008 à 14:41:45    

Bonjour à tous,
J'affiche une image qui est cliquable pour renvoyer les coordonnées de l'endroit ou  on  clique et je superpose une image, mais la partie à droite de cette image n'est pas cliquable, pourquoi ?

Code :
  1. <html>
  2. <head>
  3. </head>
  4. <body>
  5. <form method="POST" action="index.php">
  6. <input type="image" border="0" src="photo_base.jpg">
  7. <div id="test" style="position: relative; top: -250px; left: 150px;">
  8. <img border="0" src="photo_over.png">
  9. </div>
  10. </form>

Reply

Marsh Posté le 12-06-2008 à 14:41:45   

Reply

Marsh Posté le 12-06-2008 à 14:54:02    

entre temps, qqes test me montrent qu'en mettant position: absolute c'est  OK, mais pas avec position: relative
Mais pourquoi donc ?

Reply

Marsh Posté le 12-06-2008 à 14:54:59    

PB sur firefox mais pas sur IE

Reply

Marsh Posté le 14-06-2008 à 11:22:37    

personne n'a jamais eu ce PB ?

Reply

Marsh Posté le 15-06-2008 à 13:49:34    

salut,
 
et si tu essayais avec du css  
avec z-index par exemple ?

Reply

Marsh Posté le 15-06-2008 à 20:19:53    

peut etre parce que c ets ton input qui est cliquable et que ton image depasse ?


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 15-06-2008 à 21:32:06    

salut,
avec z-index, ça ne change rien, quand je met -1, l'image qui est dessus disparaît et la zone de droite devient cliquable, mais pas sur toute la hauteur.
Mais je veux que cette imagette soit dessus.
L'imagette ne dépasse pas !
Je ne vois vraiment pas.

Reply

Marsh Posté le 15-06-2008 à 23:29:11    

ca veut rien dire z-index=-1
le plus petit index vaut zero et c est la valeur par defaut
 
bon je viens de regarder ton code et je me rends compte que... je comprends pas ce que tu veux faire mais en tout cas tu le fais mal
 
les input image c est juste le petit nom qu on a donné à la barque qui traverse le styx
 
donc explique ce que tu veux faire vraiment et on verra comment proceder au lieu de bricoler


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 16-06-2008 à 08:57:13    

salut,
merci de ton aide.
1) J'affiche une image et quand je clique, ça renvoye les coordonnées de l'endroit cliqué
2) cette même image s'affiche avec une imagette par dessus et celle du dessous reste cliquable
 
Le problème est que quand j'affiche les 2 images superposées, juste à droite de celle de dessus, ce n'est pas cliquable, alors que normalement ça devrait être cliquable tout autour.
 
A+

Reply

Marsh Posté le 16-06-2008 à 13:16:26    

mIRROR a écrit :

ca veut rien dire z-index=-1
le plus petit index vaut zero et c est la valeur par defaut
 
bon je viens de regarder ton code et je me rends compte que... je comprends pas ce que tu veux faire mais en tout cas tu le fais mal
 
les input image c est juste le petit nom qu on a donné à la barque qui traverse le styx
 
donc explique ce que tu veux faire vraiment et on verra comment proceder au lieu de bricoler


sisi ca marche, seulement dans certains cas  [:kbchris]

Reply

Marsh Posté le 16-06-2008 à 13:16:26   

Reply

Marsh Posté le 16-06-2008 à 13:34:17    

gatsu35 a écrit :


sisi ca marche, seulement dans certains cas  [:kbchris]


 
désolé j ai pas ta patience :o
 

polo7 a écrit :

salut,
merci de ton aide.
1) J'affiche une image et quand je clique, ça renvoye les coordonnées de l'endroit cliqué
2) cette même image s'affiche avec une imagette par dessus et celle du dessous reste cliquable
 
Le problème est que quand j'affiche les 2 images superposées, juste à droite de celle de dessus, ce n'est pas cliquable, alors que normalement ça devrait être cliquable tout autour.
 
A+


la tu me dis que des trucs que je sais deja
tu veux recuperer les coordonnees pour en faire quoi?
l imagette est cliquable aussi?
les details quoi


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 16-06-2008 à 23:24:47    

ok, désolé:
j'utilise ces coordonnées pour afficher l'imagette à l'endroit cliqué.
cette imagette est cliquable et l'image derrière aussi, de manière à pourvoir ajouter d'autres imagettes.
 
Merci A+

Reply

Marsh Posté le 17-06-2008 à 07:14:41    

ok donc toi meme n en a pas vraiment besoin (comprendre: tu vas pas le stocker dans un DB ou que ton serveur ne va pas servir une image specifique aux coordonnees)
c etait bien ce qui me semblait mais j etais pas sur
 
donc tu te debarrasses de ton form et de cet input inutiles (voire chiants meme)
tu mets juste ton image et tu fais ton traitement par javascript


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 17-06-2008 à 14:09:06    

si, je vais stocker les coordonnées dans une BDD et les récupérer pour afficher une image correspondant à ces coordonnées, donc plusieurs imagettes s'afficheront par dessus la grande.

Reply

Marsh Posté le 18-06-2008 à 15:34:52    

et si on clique sur une vignette tu veux aussi ces coordonnées ?
 
en tout cas ca risque d etre compliqué et il faudra deployer l artillerie lourde (ajax et tout le toutim pour acceder a ta BD, simulation du input...)


---------------
« The enemy is the gramophone mind, whether or not one agrees with the record that is being played at the moment. » — George Orwell
Reply

Marsh Posté le 18-06-2008 à 23:37:12    

non, la vignette envoye sur un lien spécifique à cette vignette.
Ajax, je ne pense pas car je récupère avec PHP/MySQL et je met les coordonnées, ça fonctionne, mon seul PB est que Firefox n'affiche plus le lien juste à droite de l'imagette, alors que IE l'affiche !

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed