IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[DOM] dessiner un point


Sujet :

JavaScript

  1. #1
    Membre à l'essai
    Profil pro
    Inscrit en
    Août 2005
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2005
    Messages : 17
    Points : 14
    Points
    14
    Par défaut [DOM] dessiner un point
    Bonjour,

    je voulais savoir si vous connaissez une méthode pour dessiner un pointeur (un carré de 5 pixels de coté par exemple) à l endroit où je clique sur une image.

    Merci, @+

  2. #2
    LEK
    LEK est déconnecté
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    715
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 715
    Points : 470
    Points
    470
    Par défaut
    Tu peux placer un div aux coordonées adéquates avec un zIndex supérieur à celui du calque contenant l'image de fond.

  3. #3
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 649
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 649
    Points : 11 138
    Points
    11 138
    Par défaut
    par contre pour connaître la position de la souris dans une page c'est toute une histoire
    http://www.developpez.net/forums/sho...d.php?t=316503

  4. #4
    Membre à l'essai
    Profil pro
    Inscrit en
    Août 2005
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2005
    Messages : 17
    Points : 14
    Points
    14
    Par défaut
    Merci pour vos réponses.

    Pour l'instant j'arrive à récupérer la position de la souris, mais je n'arrive pas à faire apparaitre le DIV.

    Mais je ne sais pas si comme ça je peux faire apparaitre plusieur div sur une meme image ?


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    27
     
    <SCRIPT language="JavaScript">
     
         function detectMouse(e){
     
         var x =0;
         var y =0;
                  if(parseInt(navigator.appVersion) >=4){
                     if(navigator.appName == 'Netscape'){
                         x = e.pageX ;
                         y = e.pageY;
                     }
                     else{
                         x = event.x ;
                         y = event.y;
                     }
     
                 }
     
                 document.getElementById('zone').value = x;
                 document.getElementById('zone1').value = y;
                 <div style="font-size:1px; width:3px; heigth:3px; background-color:#0000FF; position:absolute; top:'+(y-1)+'px; left:'+(x-1)+'px; ">&nbsp;</div>
     
     
        }
     
        </SCRIPT>

  5. #5
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 649
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 649
    Points : 11 138
    Points
    11 138
    Par défaut
    pour créer un élement, il faut passer par des fonctions du DOM :

    remplace
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <div style="font-size:1px; width:3px; heigth:3px; background-color:#0000FF; position:absolute; top:'+(y-1)+'px; left:'+(x-1)+'px; ">&nbsp;</div>
    par :
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
     
    //creation du div
    var monDiv = document.createElement("div");
     
    //definition du style 
    monDiv.style.fontSize = "1px";
    monDiv.style.width = "3px";
    monDiv.style.height = "3px";
    monDiv.style.backgroundColor = "#0000FF";
    monDiv.style.position = "absolute";
    monDiv.style.top = parseInt(y-1)+"px";
    monDiv.style.left = parseInt(x-1)+"px";
    monDiv.style.zIndex = "100";
     
    //contenu du div
    monDiv.innerHTML = "&nbsp;";
     
    //ajout du div dans le document
    document.body.appendChild(monDiv);

  6. #6
    Membre à l'essai
    Profil pro
    Inscrit en
    Août 2005
    Messages
    17
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Août 2005
    Messages : 17
    Points : 14
    Points
    14
    Par défaut
    Grand merci, je ne trouvais pas le moyen de le faire.

    Ça fonctionne nickel !!

    Encore merci de m'avoir répondu à cette heure ci.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Dessiner un point ou un zigzag
    Par DrTank dans le forum AWT/Swing
    Réponses: 4
    Dernier message: 15/05/2007, 09h25
  2. Dessiner un point avec TCanvas VCL
    Par EntraX666 dans le forum Delphi
    Réponses: 6
    Dernier message: 08/05/2007, 16h22
  3. Dessiner des points
    Par maxtiger dans le forum Windows Forms
    Réponses: 1
    Dernier message: 22/03/2007, 12h03
  4. Réponses: 3
    Dernier message: 31/10/2005, 16h47
  5. moteur de particules :Dessiner un point
    Par houssa dans le forum OpenGL
    Réponses: 2
    Dernier message: 25/06/2003, 22h13

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo