Hallo,
ich würde gerne ein IMG-Element mit der Maus verschieben. Dazu habe ich eine Datei erstellt, die mit dem IE und mit Opera ohne Probleme funktioniert.
Mit Firefox 2 funktioniert es eher selten. Meistens wird das Bild nicht mitbewegt, sondern es bleibt stehen und der Cursor ändert sich in ein Stop-Symbol. Man muss dann die Maustaste loslassen, dann bewegt sich das Bild wieder. Leider habe ich dies aber so überhaupt nicht programmiert, denn das Bild soll sich nur bei gedrückter Maustaste bewegen (Drag & Drop).
Den gleichen Effekt erzielt man auch mit DIV-Tags.
Kann mir jemand sagen, wo hier das Problem liegt?
Vielen Dank schon mal.
Gruß Ulli
<html>
<head>
<script>
Active = false;
posx = 0;
posy = 0;
function Init() {
document.onmousedown = MouseDown;
document.onmouseup = MouseUp;
document.onmousemove = MouseMove;
}
function MouseDown(e) {
if (!e) e=window.event
srcElement = (e.srcElement) ? e.srcElement: e.target;
if (srcElement.id == "xxx") { Active = true; }
e.cancelBubble = true;
}
function MouseUp(e) {
Active = false;
if (!e) e=window.event
e.cancelBubble = true;
}
function MouseMove(e) {
if (!e) e=window.event
if (e.pageX || e.pageY) {
posx = e.pageX;
posy = e.pageY;
}
else {
posx = e.clientX;
posy = e.clientY;
}
if (Active) {
document.getElementById("xxx").style.left = posx-50;
document.getElementById("xxx").style.top = posy-50;
e.cancelBubble = true;
}
}
</script>
</head>
<body onload="Init();">
<img id="xxx" width="100" height="100" style="position:absolute; border:1px solid black;">
</body>
</html>