| 

.NET C# Java Javascript Exception

2
Hallo zusammen, ich hatte kürzlich bereits eine frage diesbezüglich gestellt, nur leider keine antwort bis jetzt. Natürlih habe ich mittlerweile meinen code ausgebaut, doch er funktioniert immer noch nicht.

Es geht um ein div dessen bewegungsraum ich eingrenzen möchte. z.B. max 100px nach Rechts und 200px nach Links.

der code dafür sieht so aus:
var worldXleft = $('div.world').position().left;
var worldXright = $('div.world').position().right;

var mapXleft = $('.map').position().left;
var mapXright = $('.map').position().right;

$( ".map" ).draggable({
drag: function( event, ui ) {}
});

$( ".map" ).on( "drag", function( event, ui ) {
if(mapXleft > worldXleft) mapXleft = 0;
if(mapXright < worldXright) mapXright = -1500;
} );


Es passiert aber nichts, garnichts -.-

wenn sich es jemand anschauem möchte kann man das nichtKunstwerk hier betrachten:

http://jsfiddle.net/LbfyR/4/

hoffe man versteht mich nun etwas besser und hatt vieleicht ne idee, nen tip für mich?


mfg GioCece
14.01.2013
GioCece 152 1 6
Das erinnert aber sehr stark an deine letzte Frage: http://codekicker.de/fragen/jQuery-Div-Bewegungsraum-eingrenzen <.<
Karill Endusa 14.01.2013
ja das tut es weil ich bis jetzt leider noch keine lösung gefunden habe. Hatte weiter rumgesucht und bin dann auf die event funktion gestoßen und habe den code um die paar zeilen erweitert die ich gepostet habe. Ich dachte das ich beim letzten mal zuwenig infos gegeben habe und dachte das vieleicht keiner drauf antworten will weil es vieleicht so aussieht als ob ich vorhabe das mir jemand den code schreibst. Das ist aber wirklich nicht der fall ...

Mri würde es reichen wenn mir jemand einfach nur sagen könnte warum meine zwei if-afragen nicht greifen bzw. was daran falsch ist.
GioCece 14.01.2013
Nun das ist einfach erklärt. Der drag-Event-Handler macht nichts außer ein paar Variablen zu setzten.
Floyd 14.01.2013
danke Floyd, also so hätte ich es lange nicht hinbekommen ... wenn ich fragen darf, wofür stehen die "3" === ? warum nicht nur 2? und wenn du erlaubst, hannst du mir vieleicht ein buch empfehlen für javascript/jquery? gruu GioCece
GioCece 14.01.2013
1
Die Verwendung von 3 Gleichheitszeichen bewirkt, das nicht nur der Inhalt einer Variable sondern auch der Datentyp geprüft wird.

Ein Beispiel:

console.log(2 == "2"); //true
console.log(2 === "2"); //false
console.log(2 === 2); //true

Buchempfehlungen packe ich in meine Antwort unten dran.
Floyd 14.01.2013
Erledigt. Siehe überarbeitet Antwort.
Floyd 14.01.2013
Kleine Anmerkung: Weitere Infos zu dem Thema der Equals-Vergleiche:

http://jquery-howto.blogspot.de/2012/11/jquery-double-tripple-equal-difference.html
Floyd 02.02.2013
1 Antwort
2
Hier ein mögliche Lösung:

drag: function( event, ui ) {
var dragged = ui.helper;
var dragged_data = dragged.data('draggable');
var direction = (dragged_data.originalPosition.left > dragged.position().left) ? 'left' : 'right';

//log(direction + '/' + $('.map').position().left);
if(direction === 'right' && $('.map').position().left > 0){
$('.map').css("left", 0);
return false;
}
if(direction === 'left' && $('.map').position().left < -1000){
$('.map').css("left", -1000);
return false;
}
}


Demo: jsfiddle.net/dhVAN/
Getestet mit Firefox 18

Kurze Erklärung:

Als erstes musst du die Richtung ermitteln in der das DIV verschoben werden soll. Dann kannst du abhängig davon die Limits prüfen. Dh. die maximal mögliche Position in der umgekehrten Richtung. (Wenn ich nach rechts schieben muss du die weitesgehend mögliche linke Position prüfen.) Wenn die Prüfung fehlschlägt kannst du mit "return false;" das draggen verhindern. Das manuelle setzten der CSS-Position korrigiert den Wert und führt die gewünsche Nutzeraktion bis zum maximal möglichen Punkt aus.

Buchempfehlungen:

Ein sehr gutes Buch aber nur in englisch verfügbar ist: JavaScript Patterns von Stoyan Stefanov.

Alternativ kann ich noch die Bücher JavaScript: Einführung, Programmierung und Referenz von Stefan Koch, JavaScript - Das umfassende Referenzwerk von David Flanagan und jQuery: Das Praxisbuch (Galileo Computing) von Frank Bongers empfehlen.

Kostenlos und als Online-Nachschlagewerk gut zu gebrauchen bietet sich neben Google auch das Buch JavaScript und AJAX von Christian Wenz an.
14.01.2013
Floyd 14,6k 3 9
Floyd 14,6k 3 9
vielen dank!
GioCece 14.01.2013
Was mir gerade noch einfällt. Denk bitte daran das es besser wäre $('.map') einer Variable zuzuweisen. In meinem Beispiel (quick & dirty) wird die Expression ".map" 4x ausgeführt. Das ist unnötig. Ich passe mein Beispiel dem entsprechend an wenn du es wünschst.
Floyd 14.01.2013
Meine "ausgewertet" nicht "ausgeführt".
Floyd 14.01.2013

Stelle deine Javascript-Frage jetzt!