0

i use a long gray pane which can be draggable and i have a window to over the pane. the window is overflow:hidden; on the pane. then how can I drag the pane without the white part and the pane can bounce if it can't be drag? the effect i want is like the timeline bar in following web:

http://world.time.com/2013/12/05/nelson-mandelas-extraordinary-life-an-interactive-timeline/

(when i drag too many left or right, it will bounce itself. so the white part won't appear)

thank u :)

PS. i try to use the draggable but i don't know how to do this~

HTML 

`<div class="window" style="width:1000px;height:200px;overflow:hidden;">
     <div class="pane" style="background:grey;width:4000px;height:200px"></div>
 </div>            `

JS

JS
`$('.pane').draggable({

     axis:x;
});
`
user2956843
  • 177
  • 1
  • 10
  • Check jQuery++ at jquerypp.com. It covers your requirement and give extra power to drag and drop. – redV Oct 21 '14 at 07:00
  • thank you for your advice. i try the jQuery++, but the drag.limit() method can't respond my need. because my pane is longer than its parent. still thanks and i will try another methods in jQuery++. – user2956843 Oct 21 '14 at 07:17
  • What do you mean *" I have a window to over the pane"*..? – T J Oct 21 '14 at 16:53
  • I use a div which class is window and another div which class is pane.
    the pane's width is long but the window use overflow:hidden to hide the part it out of the window     – user2956843 Oct 27 '14 at 02:41

0 Answers0