erkennen, wenn das Element nach links oder rechts gezogen wird, wenn die jQuery UI ziehbar ist?

Question

Ich benutze JQuery UI, um ein Element ziehbar zu machen und im Code kann man angeben, was beim Start, Ziehen und Beenden zu tun ist.

Aber wie kann ich eine Funktion auf Drag links und eine andere auf Drag rechts ausführen?

Ich habe die ziehbare Achse bereits auf die x-Achse beschränkt. Das Element kann also nur nach links oder rechts verschoben werden.

Answer 1

prüfen diese Demo: http://jsfiddle.net/3NtS9/

Sie können es tun, indem er gegen die Vorveranstaltung auf jeden atomaren Drag-Operation koordinieren zu überprüfen.

var prevX = -1; 

$('div').draggable({ 
    drag: function(e) { 
     //console.log(e.pageX); 
     if(prevX == -1) { 
      prevX = e.pageX;  
      return false; 
     } 
     // dragged left 
     if(prevX > e.pageX) { 
      console.log('dragged left'); 
     } 
     else if(prevX < e.pageX) { // dragged right 
      console.log('dragged right'); 
     } 
     prevX = e.pageX; 
    } 
}); 

Answer 2

Ich würde Sie empfehlen, die start und stop Ereignisse zu behandeln und die Position Delta in Stoppereignis bestimmen zu erhalten, ob es verschoben wurde nach links oder rechts:

http://jqueryui.com/draggable/#events

Answer 3

Hier ist ein einfacher Weg, zu tun es:

$("#draggable").draggable({ 
    drag: function(event, ui) { 
     $(this).text(ui.originalPosition.left > ui.position.left ? 'left' : 'right'); 
    } 
}); 

Demo: http://jsfiddle.net/GNHTW/