Faire un zoom d'image a l'endroit du curseur
Résolu
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
-
22 juil. 2009 à 09:47
YanDerS Messages postés 9 Date d'inscription samedi 13 juin 2009 Statut Membre Dernière intervention 25 août 2009 - 25 août 2009 à 14:47
YanDerS Messages postés 9 Date d'inscription samedi 13 juin 2009 Statut Membre Dernière intervention 25 août 2009 - 25 août 2009 à 14:47
A voir également:
- Zoom image javascript
- Récupérer données json (javascript) - Conseils pratiques -Javascript
- Javascript poo - Conseils pratiques -Javascript
- Convolution image - Conseils pratiques -Java
- Base de données javascript - Conseils pratiques -Javascript
- Vectoriser une image photoshop ✓ - Forum Graphisme/design
16 réponses
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 10:28
22 juil. 2009 à 10:28
Bonjour,
>>Voici mon code actuel:
rien vu sur ce coup là !?!
détecter la positon du curseur ?
ch'tiot exemple qui donne la position sur la page
vous devriez savoir adapter
sinon : souris&s=javascriptfr.com regardez donc ici
Cordialement
>>Voici mon code actuel:
rien vu sur ce coup là !?!
détecter la positon du curseur ?
ch'tiot exemple qui donne la position sur la page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
.
<script type="text/javascript">
function Deplace( evt )
{ var posCur={ "x":0, "y":0 };
if ( window.event )
{ posCur.x=window.event.x+document.body.scrollLeft;
posCur.y=window.event.y+document.body.scrollTop;
}
else { posCur.x=evt.pageX;
posCur.y=evt.pageY;
}
return posCur;
}
document.body.onmousemove=function(event)
{ var p=Deplace( event );
document.getElementById("iddv").innerHTML="X:"+p.x+" / Y:"+p.y;
};
</script>
</html>
vous devriez savoir adapter
sinon : souris&s=javascriptfr.com regardez donc ici
Cordialement
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 11:01
22 juil. 2009 à 11:01
Merci pour le code je vais le tester je vous tiendrai au courant :)
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 11:59
22 juil. 2009 à 11:59
J'ai testé votre code est j'ai vu que la fonction "deplace" récupère bien la position du curseur mais j'ai un problème c'est j'ai une fonction "zoomer" dont le code est :
C'est dans cette fonction ou je veux traiter les coordonnes récupérés par la focntion "deplace" comment se passe le passage de paramètre d'un pointeur en Javascript?
Merci encore pour votre réponse!
function zoomer(zoomx,min)
{
if(document.getElementById)
{
zoom *= zoomx;
if (zoom<min){zoom=min} document.getElementById("module").style.height=zoom+'px';
}
}
C'est dans cette fonction ou je veux traiter les coordonnes récupérés par la focntion "deplace" comment se passe le passage de paramètre d'un pointeur en Javascript?
Merci encore pour votre réponse!
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 12:31
22 juil. 2009 à 12:31
là de toutes manières,dans la fonction,
vous ne faites que modifier la hauteur ???
>>comment se passe le passage de paramètre d'un pointeur
pointeur ? ça n'existe pas réellement en javascript
vous passer déjà 2 paramètres : function zoomer(zoomx,min)
ajoutez ceux que vous voulez
function zoomer( zoomx, min, X, Y, ..... )
on peut, bien entendu, passer un array, un object....
vous ne faites que modifier la hauteur ???
>>comment se passe le passage de paramètre d'un pointeur
pointeur ? ça n'existe pas réellement en javascript
vous passer déjà 2 paramètres : function zoomer(zoomx,min)
ajoutez ceux que vous voulez
function zoomer( zoomx, min, X, Y, ..... )
on peut, bien entendu, passer un array, un object....
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 13:18
22 juil. 2009 à 13:18
Oui je modifie la hauteur de l'image.
Désolé je me suis mal exprimé je voulais dire le passage d'une structure "posCur"! est ce que c'est comme toutes les autres variables?
car j'ai essayé dans la fonction "zoomer" de lancer la fonction "deplace" tout en récupérant le return dans une variable interne a la fonction "deplace" mais quand je fait un "ALERT" pour vérifier si je récupérer bien les deux coordonnées,malheureusement ca ne marche pas!
Désolé je me suis mal exprimé je voulais dire le passage d'une structure "posCur"! est ce que c'est comme toutes les autres variables?
car j'ai essayé dans la fonction "zoomer" de lancer la fonction "deplace" tout en récupérant le return dans une variable interne a la fonction "deplace" mais quand je fait un "ALERT" pour vérifier si je récupérer bien les deux coordonnées,malheureusement ca ne marche pas!
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 13:34
22 juil. 2009 à 13:34
ben oui.
je disais on peut passer un array, un object....
pour cet exemple :
remplacez
document.getElementById("iddv").innerHTML="X:"+p.x+" / Y:"+p.y;
par :
affiche(p);
et ajouter
function affiche(quoi)
{ document.getElementById("iddv").innerHTML="X:"+quoi.x+" / Y:"+quoi.y;
}
on transmet bien à une fonction.
je disais on peut passer un array, un object....
pour cet exemple :
remplacez
document.getElementById("iddv").innerHTML="X:"+p.x+" / Y:"+p.y;
par :
affiche(p);
et ajouter
function affiche(quoi)
{ document.getElementById("iddv").innerHTML="X:"+quoi.x+" / Y:"+quoi.y;
}
on transmet bien à une fonction.
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 14:01
22 juil. 2009 à 14:01
OK Merci bcp pr votre aide je pense avoir tous ce que je voulais :)
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 14:11
22 juil. 2009 à 14:11
nickel si ça baigne
j'avais simplement un doute
>>faire un zoom sur une image à l'endroit du curseur
or dans la fonction, seul le "zoom" est fait
si le but c'est de mettre l'image zoomée
là où est le curseur, il faudra jouer avec
style.top et style.left
( si style="position:absolute" )
j'avais simplement un doute
>>faire un zoom sur une image à l'endroit du curseur
or dans la fonction, seul le "zoom" est fait
si le but c'est de mettre l'image zoomée
là où est le curseur, il faudra jouer avec
style.top et style.left
( si style="position:absolute" )
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 14:58
22 juil. 2009 à 14:58
Ça marche nickel je transmet bien les coordonnés à la fonction zoom , et je comptai reprendre le traitement mais est ce que style doit obligatoirement style="position:absolute" ?
car moi j'ai :
document.write('');
avec zoom=500;
car moi j'ai :
document.write('');
avec zoom=500;
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 15:11
22 juil. 2009 à 15:11
faut éviter les document.write
si c'est exécuté lorsque la page a
été totalement interprétée ( c'est
le cas dans une fonction appelée lors
d'un click par exemple ), la page
est totalement effacée, y compris
le javascript
mettre l'image "en dur" !
on peut jouer avec
style.display="none" | inline,
style.top=position verticale+"px"
style.top=position horizontale+"px"
style.height=hauteur+"px"...
si c'est exécuté lorsque la page a
été totalement interprétée ( c'est
le cas dans une fonction appelée lors
d'un click par exemple ), la page
est totalement effacée, y compris
le javascript
mettre l'image "en dur" !
on peut jouer avec
style.display="none" | inline,
style.top=position verticale+"px"
style.top=position horizontale+"px"
style.height=hauteur+"px"...
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 15:13
22 juil. 2009 à 15:13
il fallait lire :
var i=doculment.getElementById("module");
i.style.display="none" | "inline"
i.style.top=position verticale+"px"
i.style.left=position horizontale+"px"
i.style.height=hauteur+"px"...
var i=doculment.getElementById("module");
i.style.display="none" | "inline"
i.style.top=position verticale+"px"
i.style.left=position horizontale+"px"
i.style.height=hauteur+"px"...
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 15:19
22 juil. 2009 à 15:19
i.style.display="none" | "inline"
ca permet de faire quoi ?
(Je suis désolé mais c'est mon premier prog en javascript je suis désolé si je pause des question de base :s)
ca permet de faire quoi ?
(Je suis désolé mais c'est mon premier prog en javascript je suis désolé si je pause des question de base :s)
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 15:30
22 juil. 2009 à 15:30
faut essayer ! ;o))
mais bon,
display="none" = cacher
display="inline" montrer l'élément
mais bon,
display="none" = cacher
display="inline" montrer l'élément
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
22 juil. 2009 à 16:11
22 juil. 2009 à 16:11
Merci bcccp ! ^^
Bul3
Messages postés
4933
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
16
22 juil. 2009 à 16:16
22 juil. 2009 à 16:16
il vous en prie.
YanDerS
Messages postés
9
Date d'inscription
samedi 13 juin 2009
Statut
Membre
Dernière intervention
25 août 2009
25 août 2009 à 14:47
25 août 2009 à 14:47
bonjour ,
je reposte car j'ai toujours des difficultés pour faire la fonction de zoom !
Vous m'avais aider a récupérer les coordonné du curseur que j'utilise dans la fonction "Zoomer" qui elle effectue le zoom mais j'ai du mal a coder cette fonction jai fait ca :
Quelq'un peux m'aider SVP
Merci .
je reposte car j'ai toujours des difficultés pour faire la fonction de zoom !
Vous m'avais aider a récupérer les coordonné du curseur que j'utilise dans la fonction "Zoomer" qui elle effectue le zoom mais j'ai du mal a coder cette fonction jai fait ca :
function zoomer(zoomx,min,PosCur)
{
if(document.getElementById)
{
zoom *= zoomx;
var X=(PosCur.x-5);
var Y=(PosCur.y-95);
if (zoom <min){zoom=min}
document.getElementById("module").style.height =zoom+'px';
if ((PosCur.x>10&&PosCur.x<680)&&(PosCur.y>100&&PosCur.y<580))
{
if (parseInt(document.getElementById("Box").style.height)<document.getElementById("module").height)
{
document.getElementById("module").style.top =((document.getElementById("module").height)/2)-Y/2+'px';
if (parseInt(document.getElementById("Box").style.width)<document.getElementById("module").width)
{
document.getElementById("module").style.left =((document.getElementById("module").width)/2)-X/2+'px';
}
}
}else
{
if (parseInt(document.getElementById("Box").style.height)<document.getElementById("module").height)
{
document.getElementById("module").style.top =(parseInt(document.getElementById("Box").style.height)-document.getElementById("module").height)/2+'px';
if (parseInt(document.getElementById("Box").style.width)<document.getElementById("module").width)
{
document.getElementById("module").style.left =(parseInt(document.getElementById("Box").style.width)-document.getElementById("module").width)/2+'px';
}
}
}
}
}
Quelq'un peux m'aider SVP
Merci .
