Bonjour à tous,

Je m'initie au drag and drop en html5 et j'aimerais pouvoir scroller la page quant on est entrain de déplacer un élément et que l'on arrive sur les cotés de la fenêtre.

Le problème est que les attributs event.pageX et event.pageY présents dans l’événement onmousemove ou encore onclick ne le sont pas dans ondrag et ils me seront utiles pour avoir les coordonnées du curseur.

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
 
<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta charset="utf-8">
		<title>HTML5 : Drag & Drop</title>
	</head>
	<body>
		<img id="img" src="images.jpeg" alt="" draggable="true"/>
		<script type="text/javascript" src="jquery-1.7.1.min.js" ></script>
		<script>
			$(document).ready(function(){
				//fonctionne
				$("#img").on("click",function(e){
					console.log(e.pageY);
				});
 
				//undefined
				$("#img").on("drag",function(e){
					console.log(e.pageY);
				});
 
				//undefined
				$("#img").on("drag",function(e){
					$(this).trigger("click");
				});
 
			});
		</script>
	</body>
</html>
J'aimerais donc savoir si vous avez une idée pour contourner ce problème.

Merci.