recadrer (rogner) une image

**prodi_64** · 19/10/2004, 10h55

Bonjour,

je suis en train de faire un applicatif qui contient un zoom et une carte de situation.
J'ai trouvé comment zooemr et dezoomer, mais mon pb est quand le zoom engendre un agrandissement de l'image trop important. Je m'explique : je voudrais que mon image ne depasse pas un certain cadre en pixel. Il faut donc que je puisse la rogner, une fois que ce seuil est atteint.
Je ne sais pas comment le faire!

Peut etre que je m'y prend mal avec du javascript, je ne sais pas! l'important est que mon aplicatif doit etre embarqué sur un cd et donc avec des technologies simples.

Tant que j'y suis, si qqun sait comment mettre à jour la cadre de sélection sur ma carte de situation.

Merci beaucoup

**SpaceFrog** · 19/10/2004, 10h59

mets ton 'cadre' en overflow hidden, pui en gérant le top et le left ...

**prodi_64** · 19/10/2004, 11h02

peux-tu m'expliquer ce que font les top et left, et ce qu'est un overflow?

merci

**SpaceFrog** · 19/10/2004, 11h09

bon ben commentçons par le commencement

un div tu vois ce que c'est ?
tu lui fixe une taille

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="height:100px;width:100px;">&nbsp;</div>

si tu le remplis avec plus qu'il ne peut contenir, des barres de scroll apparaitront (ascenceurs)

si tu rajoutes overflow hidden:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div style="height:100px;width:100px;overflow:hidden;">&nbsp;</div>

si tu mets un contenu plus grand que 100x100px ce qui dépasse sera caché...

maintenant si dans ce div tu place un autre div tu peux le positionner comme tu veux de façon n'avoir visible que la zone qui t'intéresse en le positionnant avec Left et Top qui gère la position du coin en haut à gauche de ce div ...(et par conséquent de tout le div ...)

**prodi_64** · 19/10/2004, 11h30

je te remercie, il ne me reste plus qu'à trouver comment recuperer l'endroit où l'on clique sur la photo pour avoir le zoom centré dessus

merci

**SpaceFrog** · 19/10/2004, 11h34

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
28
29
30
31
32
33
34
<HTML> 
<HEAD> 
 
<SCRIPT LANGUAGE="JavaScript"><!-- 
if (navigator.appName == 'Netscape') { 
document.captureEvents(Event.MOUSEMOVE); 
document.onmousemove = netscapeMouseMove; 
} 
 
function netscapeMouseMove(e) { 
if (e.screenX != document.test.x.value && e.screenY != document.test.y.value) { 
document.test.x.value = e.screenX; 
document.test.y.value = e.screenY; 
} 
} 
 
function microsoftMouseMove() { 
if (window.event.x != document.test.x.value && window.event.y != document.test.y.value) { 
document.test.x.value = window.event.x; 
document.test.y.value = window.event.y; 
} 
} 
//--></SCRIPT> 
 
</HEAD> 
 
<BODY onmousemove="microsoftMouseMove()"> <!-- onmousedown="microsoftMouseMove()" onmouseup="microsoftMouseMove()" --> 
 
<FORM NAME="test"> 
X: <INPUT TYPE="TEXT" NAME="x" SIZE="4"> Y: <INPUT TYPUE="TEXT" NAME="y" SIZE="4"> 
</FORM> 
 
</BODY> 
</HTML>

**prodi_64** · 19/10/2004, 12h57

je te remercie beaucoup, grace à toi, j'ai bien avancé!

il est possible que je te recontacte si j'ai un autre souci...

merci encore

recadrer (rogner) une image

JavaScript

Discussions similaires

Partager

Partager