PDA

View Full Version : Scrollbar style restricted dragging



lummie
1 May 2007, 6:10 AM
I am currently implementing a Vertical Scroll bar like control. I have all the keyboard and mouse events working but the final stage is implementing the drag of the thumb.

I have two divs nested, <div class="thumbarea"><div class="thumb"></div></div>.

I am trying to provide drag movement of the thumb, but restricted to only moving up and down within the container div thumb area.

Has anyone else implemented this sort of restricted dragging, or have an example that will get me started. Most of the example on the forum semm to deal with dragging from one div to another.

Any help, ideas or direction is greatly appreciated.

lummie
2 May 2007, 12:28 AM
I guess I was over engineering, looking at the Drop Zone and Drop Target, when all I really needed was to implement the thumb moving using mousedown, mouseup & mousemove on the thumb track.

Managed to get that going, and it works a treat. I'll post the code soon.

brian.moeskau
2 May 2007, 12:35 AM
You may have already figured it out, but the underlying Ext.dd.DragDrop class that the other DnD classes inherit from supports X and Y constraints. Take a look at setYConstraint() for example (http://extjs.com/deploy/ext/docs/output/Ext.dd.DD.html#setYConstraint).