Hallo,
ich habe gerade vor ein Div-Element per Drag and Drop im Browser verschieben zu können.
Das klappt soweit auch ganz gut. Jedoch spring mein Div-Element immer mit der linken oberen Ecke zum Mauszeiger.
Hier mal der Quelltext:
hier noch die CSS Datei:
Wie kann ich es machen damit ich die Box an jederstelle "anpacken" kann und sie somit verschiebe?
MfG Finnex
ich habe gerade vor ein Div-Element per Drag and Drop im Browser verschieben zu können.
Das klappt soweit auch ganz gut. Jedoch spring mein Div-Element immer mit der linken oberen Ecke zum Mauszeiger.
Hier mal der Quelltext:
Code:
<html>
<head>
<title>Drag</title>
<link rel="stylesheet" type="text/css" href="drag.css">
<script type="text/javascript">
IE = document.all&&!window.opera;
var drag = 0;
function init()
{
document.onmousemove = movebox;
document.onclick = stopdrag;
}
function movebox(ereignis)
{
if(drag == 1)
{
document.getElementById('box').style.left = (IE) ? window.event.clientX : ereignis.pageX ;
document.getElementById('box').style.top = (IE) ? window.event.clientY : ereignis.pageY;
}
}
function startdrag(ereignis)
{
drag = 1;
}
function stopdrag()
{
drag = 0;
}
</script>
</head>
<body onload="init();">
<div id="box" onmousedown="startdrag(this);">
<div id="boxinfo">
</div>
</div>
</body>
</html>hier noch die CSS Datei:
Code:
#box { position: relative; top:50px; left:50px; width:300px; height:300px;
border:2px; border-style:solid; }
#boxinfo { position: absolute; top:0px; right:0px; width:100%; height:20px;
border:1px; border-style:solid; }Wie kann ich es machen damit ich die Box an jederstelle "anpacken" kann und sie somit verschiebe?
MfG Finnex
