Drag & Drop Image
0 0 0 
Felix Riesterer
Drag & Drop Image
Hallo, ich habe folgendes Problem:
Es gibt ja hier ein beispiel für Drag&Drop für Div-Bereiche. Das Problem ist, das wenn man in diesen ein Bild einfügt, dieses nicht mehr richtig funktioniert (firefox, ie,...). Erstaunlicher weise klappt aber alles Korrekt mit der mittleren Maustaste.
Das muss was mit dem automatischen Drag&Drop des <img> zu tun haben, um z.B. das Bild in ein Verzeichnis abzulegen.
Eine Lösung wäre das Bild als Hintergrundbild einzufügen, aber das muss doch noch anderes gehen!?
Hier noch mal der Code:
<html>
<head>
<title>Drag-and-Drop</title>
<script type="text/javascript">
<!-- gueltig fuer Netscape ab Version 6, Mozilla, Internet Explorer ab Version 4
//Das Objekt, das gerade bewegt wird.
var dragobjekt = null;
// Position, an der das Objekt angeklickt wurde.
var dragx = 0;
var dragy = 0;
// Mausposition
var posx = 0;
var posy = 0;
function draginit() {
// Initialisierung der Überwachung der Events
document.onmousemove = drag;
document.onmouseup = dragstop;
}
function dragstart(element) {
//Wird aufgerufen, wenn ein Objekt bewegt werden soll.
dragobjekt = element;
dragx = posx - dragobjekt.offsetLeft;
dragy = posy - dragobjekt.offsetTop;
return false;
}
function dragstop() {
//Wird aufgerufen, wenn ein Objekt nicht mehr bewegt werden soll.
dragobjekt=null;
return false;
}
function drag(e) {
//Wird aufgerufen, wenn die Maus bewegt wird und bewegt bei Bedarf das Objekt.
posx = document.all ? window.event.clientX : e.pageX;
posy = document.all ? window.event.clientY : e.pageY;
if(dragobjekt != null) {
dragobjekt.style.left = (posx - dragx) + "px";
dragobjekt.style.top = (posy - dragy) + "px";
}
return false;
}
//-->
document.onmousedown = new Function('e','if(((e = e || window.event).target || e.srcElement).tagName == "IMAGE") return false;');
</script>
</head>
<body onload="draginit()">
<div onmousedown="dragstart(this)" style="position:absolute;top:200px;left:0px;height:100px;width:100px;background:#00ff00">
<img src="bildervorlader/2.JPG" alt="2.JPG, 1827 kB" title="2" height="111" width="111">
</div>
<div onmousedown="dragstart(this)" style="position:absolute;top:100px;left:0px;height:100px;width:100px;background:#00ff00">
<img src="bildervorlader/1.JPG" alt="2.JPG, 1827 kB" title="2" height="111" width="111">
</div>
</div>
</body>
</html>
-
Hat den Keiner eine Idee?
Wäre echt dankbar!
-
Hellihello
Hallo, ich habe folgendes Problem:
Es gibt ja hier ein beispiel für Drag&Drop für Div-Bereiche.
wo denn?
Das Problem ist, das wenn man in diesen ein Bild einfügt, dieses nicht mehr richtig funktioniert (firefox, ie,...). Erstaunlicher weise klappt aber alles Korrekt mit der mittleren Maustaste.
Das muss was mit dem automatischen Drag&Drop des <img> zu tun haben, um z.B. das Bild in ein Verzeichnis abzulegen.
Eine Lösung wäre das Bild als Hintergrundbild einzufügen, aber das muss doch noch anderes gehen!?
Hier noch mal der Code:
<html> <head> ...code kann gehighlighted werden (links können gelegt werden).
frankx
-
Lieber Andreas,
Das Problem ist, das wenn man in diesen ein Bild einfügt, dieses nicht mehr richtig funktioniert (firefox, ie,...).
definiere "nicht mehr richtig funktioniert"! Was passiert, wenn ein Bild "funktioniert"?
Erstaunlicher weise klappt aber alles Korrekt mit der mittleren Maustaste.
Was klappt da? Was passiert, wenn alles "Korrekt" klappt?
Hier noch mal der Code:
Code ist klar, aber was ist diese Zeile hier?
</div>
Irgendwie erscheint mir diese Zeile überflüssig...
Ich muss zugeben, dass ich Dein Problem nicht verstanden habe. Drag&Drop verhält sich bei mir fast in allen Browsern wie gewünscht...
Liebe Grüße aus Ellwangen,
Felix Riesterer.