CODEWITHSUNDEEP
jqueryjquery-uidraggable
Obeck
Obeck

Reputation: 67

Jquery UI snapMode center

I have built a cloze. Very long words are not easy to place in the gap. I do not want to expand the gap. So it's possible that the element jumps (snap) to the center of the gap if it is hover. 

$('.gap').draggable({
    disabled: true,
    snap: '.ui-draggable',
    snapMode: 'inner', /* i find "inner", "outer", "both"*/
});

here the example

Upvotes: 1

Views: 1388

Answers (1)

Trevor
Trevor

Reputation: 16116

I know this might not be quite what your looking for but one option is to just make the .gap as wide as the word your dragging. This can be done really easily like so

http://jsfiddle.net/7rwWA/1/

Now I think it would be even better to only make the .gap wider when your hovering over it but there is no built in way to do this. But its possible if you were to check for the .gap that a snap was triggered on and then make the gap bigger. This question may be useful.

Jquery UI – draggable 'snap' event

Upvotes: 1

Related Questions