voila, je suis pas du tout calé en javascript, mais je tente de voire un peu plus clair dans ce langage.
Tout comme bon début, j'ai un problème
je tente de faire un drag and drop sur une div, j'ai réussi a faire que lors d'un onMouseDown ma div suive mon pointeur de souris, mais quand je lâche ma div et que je retente de la redeplacer, elle ne suit plus, comme si j'avais mal réinitialiser quelque chose, ou que j'avais pas fait les appels de fonction dans le bon ordre.
assez parler, voila du code ^^ :
index.html
window.js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Window</title> <style type="text/css" media="screen">@import "window.css";</style> <script type="text/javascript" src="window.js"></script> </head> <body onLoad="getAll()"> <div id="window" onMouseOver="mouseOver(this)"></div> </body> </html>
et le window.css
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 var mouseX = 0; var mouseY = 0; var mouseOffsetX = 0; var mouseOffsetY = 0; var dragObj = 0; function mousePos(e) { mouseX = (navigator.appName == "Netscape") ? e.pageX : event.x + document.body.scrollLeft; mouseY = (navigator.appName == "Netscape") ? e.pageY : event.y + document.body.scrollTop; if (dragObj) { dragObj.style.left = mouseX - mouseOffsetX + "px"; dragObj.style.top = mouseY - mouseOffsetY + "px"; } } function mouseDown(e) { if (!e) return ; dragObj = this; mouseOffsetX = mouseX - dragObj.offsetLeft; mouseOffsetY = mouseY - dragObj.offsetTop; } function mouseUp(e) { dragObj = 0; } function mouseOver(e) { e.onmousedown = mouseDown; } function getAll() { if (navigator.appName == "Netscape") document.captureEvents(Event.MOUSEMOVE); document.onmousemove = mousePos; document.onmouseup = mouseUp; }
si vous pouviez tester ca de votre coter (sous firefox
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9 #window { left: 400px; width: 400px; height: 250px; position: absolute; border: solid 1px #00f; background: #eee; }) pour me dire où j'ai merdé
merci![]()
Partager