var speed = 0.2;			// Speed (in percent) of animation (default: 0.2)
	var intervalDelay = 10;		// Animation frame delay in ms (default: 10)
	var imageOffset = 123;		// Total width to scroll for each image (default: 123)
	var	intervalId = 0;			// Interval id holder for cancelling
	var menuTargetX = 0;		// Set this to the destination for the left edge of the menu
	var menuCurrentX = 0;		// Holds current menu location
	var firstSlide = true;		// Flag to add 1px offset to destination
	var totalStyles = 0;		// Total styles, set by dynamically generated script later on
	var scrollIndex = 1;		// Index of current location
	var swatchesPerPage = 6;	// Number of swatches per page, used for paging calculations, does not control layout
	
	function slideMenu(dir)
	{	
		// Determine the direction to move
		if (dir == 'left')
		{
			if (scrollIndex == 1) return;	// Do not scroll past the beginning
			scrollIndex--;					// Decrement the index
			menuTargetX += imageOffset;		// Increase the targetX by offset value
		}
		else 
		{
			if (scrollIndex == (totalStyles - swatchesPerPage + 1)) return;	// Do not scroll past the end
			scrollIndex++;													// Increment the index
			menuTargetX -= imageOffset;										// Decrease the targetX by offset value
		}
		if (firstSlide) menuTargetX += 1;	// Slight offset for first move
		firstSlide = false;					// Clear flag
		if (intervalId == 0) intervalId = setInterval(moveMenu, intervalDelay);	// Set interval for animation
	}
	
	function showInitialSelection(index)
	{
		if (index <= swatchesPerPage) return;								// Do not scroll if the index is on the first page
		scrollIndex = index - swatchesPerPage + 1;							// Set new scroll index
		menuTargetX = -1 * (((index - swatchesPerPage) * imageOffset) + 1);	// Calculate new targetX value
		intervalId = setInterval(moveMenu, intervalDelay);					// Start animation cycle
	}
	
	function moveMenu()
	{
		var strip = document.getElementById("imagestrip");	// Ref the image strip
		if (menuCurrentX == menuTargetX)					// Animation complete?
		{
			// All done, clear timeout
			clearInterval(intervalId);
			intervalId = 0;
			return;
		}
		
		// Get difference between where we want to be and where
		// we are, in a percentage value for smooth animation.
		var difference = Math.floor((menuTargetX - menuCurrentX) * speed);
		if (difference == 1)
		{
			// Close enough for darts and horseshoes
			menuCurrentX = menuTargetX;
			strip.style.left = menuTargetX + "px";
			clearInterval(intervalId);
			intervalId = 0;
			return;
		}
		// Animate
		menuCurrentX = (menuCurrentX + difference);
		strip.style.left = (menuCurrentX + difference) + "px";
	}