Bonjour tout le monde,
je realise un jeu, qui se base sur un principe de drag&drop, j'ai un code qui me dessines une belle case et je peux la bouger comme je veux, j'ai utilis� pour cela un canvas voir le code ci dessous
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
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
 
var canvas;
var ctx;
var x = 75;
var y = 50;
var WIDTH = 500;
var HEIGHT = 300;
var out = false;
 
function rect(x,y,w,h) {
 ctx.beginPath();
 ctx.rect(x,y,w,h);
 ctx.fillText("",w,h)
 ctx.closePath();
 ctx.fill();
}
 
function clear() {
 ctx.clearRect(0, 0, WIDTH, HEIGHT);
}
 
function init() {
 canvas = document.getElementById("canvas");
 ctx = canvas.getContext("2d");
 return setInterval(draw, 10);
}
 
function draw() {
 clear();
 //ctx.font = "bold 22pt Calibri,Geneva,Arial";
 ctx.fillStyle = "black";
 rect(0,0,WIDTH,HEIGHT);
 ctx.fillStyle = "rgba(183, 274, 153, 0.5)";
 rect(x - 30, y - 30, 80, 80);
 
}
 
 
function myMove(e){
 if (out){
  x = e.pageX - canvas.offsetLeft;
  y = e.pageY - canvas.offsetTop;
 }
}
 
function myDown(e){
 if (e.pageX < x + 15 + canvas.offsetLeft && e.pageX > x - 15 +
 canvas.offsetLeft && e.pageY < y + 15 + canvas.offsetTop &&
 e.pageY > y -15 + canvas.offsetTop){
  x = e.pageX - canvas.offsetLeft;
  y = e.pageY - canvas.offsetTop;
  out = true;
  canvas.onmousemove = myMove;
 }
}
 
function myUp(){
 out = false;
 canvas.onmousemove = null;
}
 
init();
canvas.onmousedown = myDown;
canvas.onmouseup = myUp;
J'ai un code similaire qui fait la meme chose mais pour un text.
ce que je n'arrives pas a faire c'est de faire bouger les deux en meme temps, sachant que le but final c'est de prendre la phrase, la d�couper (string.split), mettre chaque mot dans une case et faire bouger le tout.
PS : c'est un jeu ou il faut reformer une phrase a partir de mots m�lang�s
merci pour votre aide !