Div verplaatsen.
Dit is wat ik tot nu toe heb..
Code (php)
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
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
<script type="text/javascript">
<!--
var IE = document.all?true : false;
if (!IE) document.captureEvents(Event.MOUSEMOVE);
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;
// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
} else { // grab the x-y pos.s if browser is NS
tempX = e.pageX
tempY = e.pageY
}
// catch possible negative values in NS4
if (tempX < 0){tempX = 0}
if (tempY < 0){tempY = 0}
document.getElementById('xy').value = tempX + ',' + tempY;
}
function versleep() {
document.getElementById('versleepbaar').style.left = tempX;
document.getElementById('versleepbaar').style.top = tempY;
}
//-->
</script>
</head>
<body>
<input id="xy" value="" />
<div id="versleepbaar" style="border: 1px solid black; width: 50%; left:0; top:0;" onmousedown="versleep">Jason is cool!</div>
<!--
var IE = document.all?true : false;
if (!IE) document.captureEvents(Event.MOUSEMOVE);
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;
// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
} else { // grab the x-y pos.s if browser is NS
tempX = e.pageX
tempY = e.pageY
}
// catch possible negative values in NS4
if (tempX < 0){tempX = 0}
if (tempY < 0){tempY = 0}
document.getElementById('xy').value = tempX + ',' + tempY;
}
function versleep() {
document.getElementById('versleepbaar').style.left = tempX;
document.getElementById('versleepbaar').style.top = tempY;
}
//-->
</script>
</head>
<body>
<input id="xy" value="" />
<div id="versleepbaar" style="border: 1px solid black; width: 50%; left:0; top:0;" onmousedown="versleep">Jason is cool!</div>
Gesponsorde koppelingen:
Ik heb geen JS ervaring maar op leejoo staan wel wat voorbeelden.
Helaas heeft die k*t site allemaal scriptje tegen rechtermuisknop e.d.
Gaa naar: http://www.leejoo.nl/
Klik in het linker menu op: Javascripts
Daarna op: Menu
Move-menu zou je eens kunnen bekijken en misschien staan er nog meerdere op, deze kwam ik net snel tegen.
Hopelijk kan je daar wat meer informatie uithalen.
Mvg,
Erik
Dan zou ik als ik jou was eens naar script.aculo.us kijken, om precies te zijn, hier en dan heb je meteen wat voorbeelden.
Voorbeeld (even op 'view source' klikken).
Maar in principe is het gewoon een stukje javascript.
