code qui ne s'exécute pas sur mon site

**Aiacciu** · 05/09/2021, 12h18

Bonjour.
J'ai réalisé un programme en java avec notepad pour le déposer sur mon site.
Quand je l'exécute à part, en glissant la page dans chrome, tout fonctionne.
Par contre, lorsque je le remets dans mon site (sur e-monsite), plus rien ne fonctionne, il semble que les fonctions créées ne s'exécute pas.
Pourtant, sur d'autres pages du site, d'autres fonctions que j'ai créées pour d'autres pages, tout marche...
Je ne comprends pas.

Code HTML :

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<head>
<script type="text/javascript"
  src="http://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
 
</head>
<script>
var zoom,largeur,hauteur, carre;
function preparer()
{
zoom = 4;
largeur = 400;      <!-- taille initiale-->
hauteur = 236;
carre=200;          <!-- taille loupe-->
 
<!-- dimensions image initiale-->
document.getElementById("initiale").width=largeur;
document.getElementById("initiale").height=hauteur;
 
<!-- dimensions  loupe-->
document.getElementById("div1").style.width=carre;
document.getElementById("div1").style.height=carre;
 
<!-- dimension dans la loupe-->
document.getElementById("img1").height=zoom*hauteur;
document.getElementById("img1").width=zoom*largeur;
}
 
function deplacer(event)
{
x = event.clientX;
y = event.clientY;
 
<!-- centrer loupe sur curseur-->
document.getElementById("div1").style.left=x-(carre/2);   
document.getElementById("div1").style.top=y-(carre/2);
 
<!-- centrer agrandissement dans la loupe -->
document.getElementById("img1").style.left=(-x*zoom)+(carre/2);
document.getElementById("img1").style.top=(-y*zoom)+(carre/2);
}
</script>
 
<body onload="preparer()" onmousemove="deplacer(event)" >
<!-- position initiale-->
<img src="http://coyote-physique.e-monsite.com/medias/images/classif3.png" id="initiale" style="position : absolute;  " ></img>
 
 
 
 
<div id="div1" style="border-radius:100px; position : absolute; top:0px; left:0px; overflow:hidden;">
 
<img id="img1" src="http://coyote-physique.e-monsite.com/medias/images/classif3.png" style="position :absolute ;"></img>
</div>
 
</body>

D'avance,merci.
Page : http://coyote-physique.e-monsite.com...est-latex.html

**mathieu** · 06/09/2021, 13h25

quand vous calculez la position de la souris, vous partez de la position de l'image seule en haut de la page quand le contenu est seul.
donc pour que ça fonctionne vous devez tenir compte de la position de l'image qui se trouve un peu plus bas de la page .

**Aiacciu** · 06/09/2021, 20h43

Très bien, merci.
Je vais tenter de trouver cette position... je ne me souviens plus trop comment la déterminer... je me casse la tête tout seul, et je reviens à vous si je n'y parviens pas, ou je ferme la discussion.
Cordialement.
Greg

**Aiacciu** · 07/09/2021, 11h57

Bonjour.
J'ai modifié les lignes en insérant les propriétés dans les caractéristiques des objets.
Il semble que les event.Xclient et event.Yclient ne sont pas reconnues.
Les grandeurs dans les fonctions n'étaient pas reconnues (largeur, hauteur...).
Il semble bien que c'était les fonctions qui ne s'appliquaient pas...
Les objets apparaissent bien dans le tableau... encore que le width du div ne s'applique pas.

Code html :

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
<head>
<script type="text/javascript"
  src="http://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
 
</head>
 
<table align="center"  style="height:500px;width:500px;">
	<tbody>
		<tr>
			<td>
			    <img src="http://coyote-physique.e-monsite.com/medias/images/classif3.png" style="width: 400px; top: 10px; height: 236px; " />
			    <div style="overflow:hidden;left=event.clientX-100; top=event.clientY-100;width:200px;height:200px;">
			    <img src="http://coyote-physique.e-monsite.com/medias/images/classif3.png" style=" left=-event.clientX*4+100;top=-event.clientX*4+100;height=800px;width=800px;" />
			</div>
			</td>
		</tr>
	</tbody>
</table>