html - jQuery Draggable() and keyboard control -

Hey there, I have a page with jQuery DragABable () which can be found on #person Is enabled and has been compelled to #person on #map .

(Link to plugin :)

However, I have also added control with it's arrow keys on the keyboard now, they all play well together until I constrained the area (Edge of the #map ).

If I'm pulling, then #person is compromised by #map - if I use arrow keys, then < You can go beyond the edge of the code> #person #map .

How can I stop dragging the arrow keys?

My code keyboard control: setdown keydown function as $ (document) .bind ('keydown', function (e) {// ... switch (E. Joe) {Case 37: $ (Name) .mate ({left: '- = 40'}, 250, function () {}); brake;}});

**** phew **** cheers.

[edit] Please anyone? Unfortunately, the jQuery UI does not expose any method to manually replace the dragable element's position [/ edit]

. You will need to manually track the status of # person while traveling with the keyboard, and stop transferring it while exceeding #map limit

For example: $ (Document) .bind (

For example:

'Keydown', function (event) {switch (event.which) {Case 37: {var character = $ ( Filename); var map = $ ('# map'); if ((character.offset (.left- 40)> map.offset (). Left) {character.animate ({left: '- = 40 '}, 250, function () {});} break;}}});