jf.depon.net/depon.net/Default.aspx
Hier versuche ich eine kleine verschiebbare Karte aufzubauen. Diese Version ist noch im frühesten Stadium.
Mein Problem nun:
Wenn man mit dem IE oder Opera die Karte greift und verschiebt, klappt alles einwandfrei. Nimmt man den Firefox, so bietet er an das Bild 'nativ' zu verschieben. Ich empfange keine OnMouseMove-Events.
Dass es prinzipiell funktioniert, sieht man an Google-Maps.
Danke für jeden Tipp.
Grüße,
TheUndeadable
Drag & Drop Probleme mit FF
gepostet vor 17 Jahre, 7 Monate von TheUndeadable
gepostet vor 17 Jahre, 7 Monate von Drezil
ich lege bei mir ein transparentes div darüber.
da kann man dann alles auch im ff richtig abfangen, allerdings weiss man dann nicht mehr, welches objekt geklickt wurde.
da hab ich mir dann noch funktionen geschrieben, die mir in meinem container die passenden objekte an der klickposition liefern (und zwar alle objekte, die auf dieser pos liegen. auch die versteckten/verdeckten).
läuft soweit ganz tuffig.
wenn du willst, kann ich dir die funktionierende version inkl. quellcode zeigen. ist aber nicht der allersauberste code ..
da kann man dann alles auch im ff richtig abfangen, allerdings weiss man dann nicht mehr, welches objekt geklickt wurde.
da hab ich mir dann noch funktionen geschrieben, die mir in meinem container die passenden objekte an der klickposition liefern (und zwar alle objekte, die auf dieser pos liegen. auch die versteckten/verdeckten).
läuft soweit ganz tuffig.
wenn du willst, kann ich dir die funktionierende version inkl. quellcode zeigen. ist aber nicht der allersauberste code ..
gepostet vor 17 Jahre, 7 Monate von TheUndeadable
An das Div hatte ich auch zuerst gedacht, aber hatte gehofft, dass es man für den Firefox keine Extra-Wurst braten muss..
gepostet vor 17 Jahre, 7 Monate von Fornax
Wie ich woanderst schon geschrieben habe, benutze ich die Mootools. Wenn man sich erst einmal reingelesen und das verstanden hat, dann finde ich das Saupraktisch. In deinem Fall müsstest du (theoretisch) nur folgenden Code als Javascript ausführen (vorher natürlich die Mootools-Javascript-Datei laden):
$("meineDivID").makeDraggable();
Um nach dem Drop die neue Position zu bekommen:
var position = element.getPosition();
alert("Neue Position (x/y): "+position["x"]+"/"+position["y"]);
}
$("meineDivID").makeDraggable(onComplete: function(){hatLosgelassen(this);});
Ich hoffe das funktioniert auch so, ich habe das jetzt nicht ausprobiert.
Hier mal ein paar interessante Links zu den Mootools:
dev.mootools.net/wiki/gettingStarted
docs.mootools.net/Native/Element.js
docs.mootools.net/Drag/Drag-Base.js
EDIT:
Das ganze funktioniert, ohne für jeden Browser eine extra Wurst in der Mikrowelle zu erwärmen (verzeiht mir diesen ungewöhnlichen Ausdruck, ich habe Hunger )
$("meineDivID").makeDraggable();
Um nach dem Drop die neue Position zu bekommen:
function hatLosgelassen(element){
var position = element.getPosition();
alert("Neue Position (x/y): "+position["x"]+"/"+position["y"]);
}
$("meineDivID").makeDraggable(onComplete: function(){hatLosgelassen(this);});
Ich hoffe das funktioniert auch so, ich habe das jetzt nicht ausprobiert.
Hier mal ein paar interessante Links zu den Mootools:
dev.mootools.net/wiki/gettingStarted
docs.mootools.net/Native/Element.js
docs.mootools.net/Drag/Drag-Base.js
EDIT:
Das ganze funktioniert, ohne für jeden Browser eine extra Wurst in der Mikrowelle zu erwärmen (verzeiht mir diesen ungewöhnlichen Ausdruck, ich habe Hunger )
gepostet vor 17 Jahre, 7 Monate von TheUndeadable
MakeDraggable wäre evtl nicht die richtige Lösung, da ich in Abhängigkeit der Verschiebung noch viele weitere Div-Elemente verschieben möchte. So dass diese auch bei Erreichen des Kartenrandes umbrechen um auf der 'hinteren' Seite wieder Nachschub an Div-Elemente liefern.
Auch würde ich ungern eine zweite JavaScript-Bibliothek einsetzen, da ich schon Atlas.Net nutze.
Auch würde ich ungern eine zweite JavaScript-Bibliothek einsetzen, da ich schon Atlas.Net nutze.
gepostet vor 17 Jahre, 7 Monate von Chojin
Hallo,
Ich poste hier jetzt einfach mal ein Stück undokumentierten Code den ich nichtmehr brauche. Das Problem war bei mir genauso, dass Firefox die Mausposition aus einer referenz des Events ziehen will, wohingegen das dem IE egal ist da es vermutlich sowieso nur einen click_event gleichzeitig geben kann... (nur ein mauszeiger und so... schon logisch oder?)
var elY;
var mouseDownY;
var elX;
var mouseDownX;
isIE=document.all;
function startDrag (evt) {
dragElement = document.getElementById("map");
elX = dragElement.offsetLeft;
elY = dragElement.offsetTop;
mouseDownX = evt.clientX;
mouseDownY = evt.clientY;
document.onmousemove = drag;
}
function drag (evt) {
move_x = isIE ? event.clientX : evt.clientX;
move_y = isIE ? event.clientY : evt.clientY;
new_posX = (elX + move_x - mouseDownX);
new_posY = (elY + move_y - mouseDownY);
}
function stopDrag () {
document.onmousemove = null;
dragElement = null;
}
document.onmouseup=stopDrag;
Gestartet wird das ganze über
Vielleicht hilft das ja weiter die richtige Lösung zu finden.
Reg4rds
chojin
Ich poste hier jetzt einfach mal ein Stück undokumentierten Code den ich nichtmehr brauche. Das Problem war bei mir genauso, dass Firefox die Mausposition aus einer referenz des Events ziehen will, wohingegen das dem IE egal ist da es vermutlich sowieso nur einen click_event gleichzeitig geben kann... (nur ein mauszeiger und so... schon logisch oder?)
var dragElement;
var elY;
var mouseDownY;
var elX;
var mouseDownX;
isIE=document.all;
function startDrag (evt) {
dragElement = document.getElementById("map");
elX = dragElement.offsetLeft;
elY = dragElement.offsetTop;
mouseDownX = evt.clientX;
mouseDownY = evt.clientY;
document.onmousemove = drag;
}
function drag (evt) {
move_x = isIE ? event.clientX : evt.clientX;
move_y = isIE ? event.clientY : evt.clientY;
new_posX = (elX + move_x - mouseDownX);
new_posY = (elY + move_y - mouseDownY);
}
function stopDrag () {
document.onmousemove = null;
dragElement = null;
}
document.onmouseup=stopDrag;
Gestartet wird das ganze über
onMousedown="startDrag(event);"
Vielleicht hilft das ja weiter die richtige Lösung zu finden.
Reg4rds
chojin