Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : cordonnée X Y sur une image [ JavaScript et le navigateur / Autre ] (Mastronic)

vendredi 17 novembre 2006 à 13:44:47 | cordonnée X Y sur une image

Mastronic

Membre Club

bonjour,

But: recuperer les coordonées lors d'un clique sur une image.

j'ai un script qui me renvoie les coordonnées quand on clique sur l'ecran. ces coordonnée XY sont définis par rapport à une origine ( en haut à gauche de la fenetre ).

Si on clique sur une image situer au milieux de l'ecran par example.. je n'obtient pas les coordonnées de limage mais celle par rapport à l'ecran...

Ma question: Comment recupérer les coordonnées par rapport à l'origine de l'image?


D'avance Merci


vendredi 17 novembre 2006 à 14:16:26 | Re : cordonnée X Y sur une image

roro06



Bonjour

Je ne crois pas qu'on puisse, à moins de positionner précisément l'image (position absolute). Mais si ton image est "au milieu de l'ecran" (donc coordonnées connues)et que tu en connais la largeur et la hauteur, tu doit réussir à retrouver tes billes.

Cordialement
Roro webDev

vendredi 17 novembre 2006 à 16:33:54 | Re : cordonnée X Y sur une image

Mastronic

Membre Club

Merci roro06,

oui, si je la positionne, je connait parfaitement les coordonnées...
je viens de rajouter ce style

.img_src{
    position:absolute;
    top : 50px;
    left : 20px; 
 }  


Je laisse le post ouvert défois que..


vendredi 17 novembre 2006 à 16:41:20 | Re : cordonnée X Y sur une image

bultez

Membre Club
Bonjour,
   position absolue ou pas, on peut connaitre
      les positions/tailles des objets : petite explication

                              Cordialement                Bul          [mon Site]       [M'écrire]

vendredi 17 novembre 2006 à 17:04:10 | Re : cordonnée X Y sur une image

PetoleTeam

Membre Club
Réponse acceptée !


B onjour...

dans ce cas il faut mettre un événement sur l'image
<IMG SRC="image.gif" onclick="Get_Position(this);">

avec une fonction du type
//-------------------------
function Get_Position(this_){
  alert( "L'objet est en PosX : " + this_.offsetLeft +" et PosY :  " + this_.offsetTop);
}

Il te suffit ensuite de faire le calcul avec la position de la mouse...



;0)

vendredi 17 novembre 2006 à 19:19:59 | Re : cordonnée X Y sur une image

Mastronic

Membre Club

Merci pour l'example PetoleTeam.

j'en deduis:
  var img_x= event.clientX - this_.offsetLeft;
  var img_y= event.clientY - this_.offsetTop;


Ca fonctionne. mais j'ai remarqué:

je suis sous IE6.0
Sur une image de 773 x 580 
La sélection en haut et/ou à gauche, j'obtient pas des coordonnées en dessous de 2 pixels.
Pour la sélection à droite, j'arrive à selectionner 1 pixel en dehors de l'image.
Pour la sélection en bas, je n'arrive pas à sélectionner apres les 475 pixels..
Pourquoi?

Apres réflexion, pour obtenir la coordonnée du curseur de la souris j'utilise event.clientXetevent.clientY .

ces fonctionnalité me retourne les coordonnées de l'affichage du client (explorateur par rapport à une origine qui bouge!!
--> si on descend l'assensseur pour voir le bas de l'image, l'origine descend aussi..

moi, je ne veux pas que l'origine bouge pour que la coordonnée calculé de l'image soit correct.

Faut'il utilisé autre chose que event.clientX  ou inclure une autre variable pour mon calcul de coordonnée de l'image?


D'avance merci.


vendredi 17 novembre 2006 à 23:47:21 | Re : cordonnée X Y sur une image

PetoleTeam

Membre Club
Réponse acceptée !

B
onsoir...

<GROSSE_PUB>
je ne saurais trop te conseiller l'EXCELLENT TUTO sur ce site...
</GROSSE_PUB>

;0)



Cette discussion est classé dans : rapport, ecran, image, clique, coordonnées


Répondre à ce message

Sujets en rapport avec ce message

position d'un element d'une grande page, au milieu de l'ecran [ par sbastian ] bonjour aux gourous du JS,j'ai une page avec une grande image (plus grande que l'ecran)sur cette image j'ai un DIV de 50x50px qui peut etre n'importe Coordonnées d'une image [ par jeanne38 ] Bonjour,J'aimerais récupérer les coordonnées d'une image sous IE.Sous Netscape, j'utilise la propriété y et ça marche :document.mon_image.y me retourn Problème de coordonnées x y d'une image [ par platinum75 ] Bonjour,je dois connaitre précisément les coordonnées d'un point sur une image. Mais je n'arrive pas à obtenir x = 0 et y = 0 qui serait le coin supér pop up a la taille de l'image [ par attentio ] salut a tous !j'aimerais savoir comment faire pour afficher une pop up qui se redimensionne a la taille de l'image (qui est a l'intérieur)et si l'imag deplacer une image à des coordonnées [ par gnosis35 ] salut voilà le pb : je clic sur une image et là j'ai pour tester deux texts box qui récupérent les coordonnées x,y de la souris... bon ça c tres bi scroll d'images [ par ctx_man ] Bonjour, Je cherche un moyen de faire un scrolling d'image presque identique à un simple "". En faisant un code comme suit il faut attendre que l'imag Valeur+1 a un champs de texte par un clique sur une image [ par fguitton ] Bonjour, voila je suis débutant en JavaScript et je voudrais savoir comment résoudre mon problème !!! Je m'explique !!!J'ai une image JPG et je voudra Position du curseur sur une image [ par Xneo ] Salut! J'aurais besoin d'un petit coup de pouce, voir même d'un petit bout de code si possible...Voila, je voulais savoir s'il etait possible sur une [Req] Clique au survol d'une image [ par Razox ] Bonjour a vous tous, tout d'abord je tiens a remercier le Staff pour avoir concu un site aussi complet et enrichissant !Ensuite j'espose mon problème Remplacer une image par un <embed> de la même taille lorsqu'on clique dessus [ par leon3d ] Bonjour,Je cherche comment remplacer une image par une balise lorsqu'on clique sur l'image.Dans mon cas il s'agirait de remplacer une image par une v


Nos sponsors

Sondage...

CalendriCode

Novembre 2008
LMMJVSD
     12
3456789
10111213141516
17181920212223
24252627282930

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,187 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.