I am creating a very simple horizontal draggable script. How can I add containment? Any tips?

Simple horizontal drag

$(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;
			}
		});
	});
});

Bounding container with set dimensions and conditionals to check the x value on mouse move?

Not so nice though...

Chris, I had that. Once you find the draggable hits the bounding box, you set the left position to the max x value. After that its not draggable anymore as it does not listen to the x value anymore...

Did you ever find a solution to this?

I did :-)

https://github.com/timbenniks/fancySlider