jquery ui draggable scroll auto -
i want implement draggable on container fixed height , width has scrolls on demand mimics infinite surface.
here css
.drag { width: 100px; height: 100px; border: 1px solid black; cursor: pointer; border-radius: 10px; text-algin: center; background-color: lightpink; }
here html. box container fixed width , height has overflow auto.
<div id="box" style="width:500px;height:300px;border:1px solid black;background-color:lightgreen;overflow:auto;"> <div id="dragx" class="drag"><p>drag me</p></div> </div>
here javascript.
$(function () { $("div[id='dragx']").draggable({ containment: "#box", scroll: true }); });
full running example can found @ http://jsbin.com/tafof/2/edit?html,output
basically when drag div extreme down or extreme right scroll bars show , allow me drag far possible. doesn't allow me drag outside of fixed width , height.
what need make scroll bars show on demand when drag extreme?
you need #box have overflow: scroll property instead of auto.
Comments
Post a Comment