Skip to content

Instantly share code, notes, and snippets.

@timbenniks
Created November 3, 2011 17:03
Show Gist options
  • Save timbenniks/1337057 to your computer and use it in GitHub Desktop.
Save timbenniks/1337057 to your computer and use it in GitHub Desktop.
I am creating a very simple horizontal draggable script. How can I add containment? Any tips?
$(function()
{
$('.drag').bind('mousedown', function(mouseDownEvent)
{
mouseDownEvent.preventDefault();
var dragger = $(this),
mouseDownPageX = mouseDownEvent.pageX,
draggerOnMouseDownLeftPos = dragger.position().left,
leftPos,
topPos;
$(document).bind('mousemove mouseup', function(event)
{
switch(event.type)
{
case 'mousemove':
leftPos = (draggerOnMouseDownLeftPos + event.pageX) - mouseDownPageX,
dragger.css({left: leftPos});
break;
case 'mouseup':
$(this).unbind('mousemove mouseup');
break;
}
});
});
});
@chrisfinch
Copy link

Did you ever find a solution to this?

@timbenniks
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment