jquery snap draggable to wrapper -



jquery snap draggable to wrapper -

i drag horizontally larger-than-browser div want snap wrapper when reaching end left , right. can not "containment" dragging not working when dragged div larger containment:

$( "#dragable" ).draggable({ cursor: "e-resize", axis: "x", containment: "document" });

http://jsfiddle.net/xbvyt/320/

for reason remove "containment" dragged div going out of browser window:

$( "#dragable" ).draggable({ cursor: "e-resize", axis: "x" });

http://jsfiddle.net/xbvyt/325/

any help much appreciated.

by controlling drag event, can prevent draggable moving out of margins: see jsfiddle here options drag event function:

$( "#dragable" ).draggable({ cursor: "e-resize" , axis: "x" , drag: function(event, ui) { var $container = $(this).closest(".wrap"); var container_left = $container.position().left; var container_right = $container.position().left + $container.width(); var drag_left = ui.offset.left; var drag_right = ui.offset.left + $(this).width(); if (drag_left > container_left) { homecoming false; }; if (drag_right < container_right) { homecoming false; }; } });

jquery jquery-ui draggable jquery-ui-draggable

Comments

Popular posts from this blog

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer -

Accessing MATLAB's unicode strings from C -

javascript - mongodb won't find my schema method in nested container -