J'utilise JQuery UI pour créer un élément draggible et dans le code, on peut spécifier quoi faire au démarrage, glisser-glisser et finir.
Mais comment puis-je exécuter une fonction sur glisser gauche et une autre sur glisser droite?
J'ai déjà limité l'axe draguable à l'axe X uniquement. Donc, l'élément ne peut se déplacer que gauche ou droite.
3 Réponses :
vérifier ceci démo em>: http://jsfiddle.net/3nts9/ Vous pouvez Faites-le en consultant la coordonnée de l'événement précédente sur chaque opération de glissement atomique. P> 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;
}
});
Je vous recommanderais de gérer les événements et et et déterminez la position Delta dans l'événement d'arrêt pour obtenir s'il a été déplacé à gauche ou à droite:
Voici un moyen plus facile de le faire:
$( "#draggable" ).draggable({
drag: function( event, ui ) {
$(this).text(ui.originalPosition.left > ui.position.left ? 'left' : 'right');
}
});
Je pense que cela ne reconnaîtra pas si la direction est modifiée sans libérer la souris.
Pour ce que pos demandé, je pense que c'est la réponse la plus simple. La réponse acceptée va toujours initialement déclencher la mauvaise direction une fois par rapport à ce que j'ai testé.