drag and drop Internet Explorer
Bonjour à tous, voilà je suis en train de créer un script afin de réaliser une scrollbar mais je me retrouve confronté à un problème que j'ai résolu sous Firefox mais je n'arrive pas à le résoudre sur Internet Explorer. Pour le moment, il s'agit d'une image que je fais bouger en X et en Y. J'ai réussi à désactiver le drag and drop navigateur sur Firefox grace à addEventListener et event.preventDefault() mais sur Internet Explorer il s'agit des méthodes attachEvent et event.returnValue=false. Je pense que je n'utilise pas correctement ces méthodes. Pouvez vous m'aidez à résoudre se problème car la je suis un peu bloqué malgrès mes diverses recherche sur google svp ? Merci d'avance.
voici mon code :
Code:
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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
| <html>
<head>
<title>test</title>
<style type="text/css">
#logo
{
position:absolute;
}
</style>
<script type="text/javascript">
var scrollbar=false;
function init()
{
if(!navigator.appName=="Microsoft Internet Explorer")
document.addEventListener("mousedown",dep_image,false);
else
document.getElementById("logo").attachEvent("onMouseDown", dep_image);
}
function dep_image(event)
{
/*permet de supprimmer le drag and drop du navigateur*/
if(event.preventDefault)
{
event.preventDefault();
}
event.returnValue = false;
/*Lorsque l'évènement survient on fait appel à la fonction position*/
document.onmousemove=position;
}
function position(ev)
{
if(scrollbar==true)
{
var coordX;
var coordY;
if(navigator.appName=="Microsoft Internet Explorer")
{
/*on récupère la position en X et en Y de la souris*/
coordX=window.event.clientX;
coordY=window.event.clientY;
document.getElementById("position_souris").innerHTML="X="+coordX+"Y="+coordY;
}
else
{
/*on récupère la position en X et en Y de la souris*/
coordX=ev.clientX;
coordY=ev.clientY;
document.getElementById("position_souris").innerHTML="X="+coordX+"Y="+coordY;
}
/*comme le curseur de la souris accroche au coin en haut à gauche, je retire la moitié
de la taille de l'image pour placer le curseur au centre*/
coordY=coordY-64;
coordX=coordX-64;
/*on affecte ensuite l'émargement haut et gauche de l'image à la position de la souris*/
document.getElementById("logo").style.marginTop=coordY+"px";
document.getElementById("logo").style.marginLeft=coordX+"px";
}
}
function stop_dep()
{
document.onmousemove=null;
}
function activer_scrollbar()
{
/*permet de s'assurer que l'utilisateur a bien le clic enfoncé sur la barre de défilement*/
scrollbar=true;
}
function desactiver_scrollbar()
{
/*lorsque l'utilisateur a relaché le clic on désactive le défilement*/
scrollbar=false;
}
</script>
</head>
<body onLoad="init();" onMouseDown="dep_image(event);" onMouseUp="stop_dep();">
<img id="logo" src="logo-ubuntu.png" onMouseDown="activer_scrollbar();" onMouseUp="desactiver_scrollbar();" />
<div id="position_souris"></div>
</body>
</html> |
