Small scroller

Sometimes you don't want the scroller to span the entire browser window, but rather just a small area of the page. This is easily accomplished by setting some styles on the element that you convert into a SmoothDivScroller. In this example the CSS looks like this:

	
	#smallScroller
	{
		width:300px;
		height: 50px;
		position: relative;
		border: solid 1px #ccc;
	}
	
	

I have also overridden the CSS of the hot spots to make them somewhat smaller. In the default CSS they are set to a minimum of 75px which is way too big for this small scroller.

	
	div.scrollingHotSpotLeft, div.scrollingHotSpotRight
	{
		min-width: 35px;
	}
	
	

One thing that I noticed when I created this example was that you percieve the scroller as going way too fast eventhough it has the same speed as the big scroller. I think it's because the viewing scope is so small and you don't get enough time to see each image that scrolls by. To compensate for this I set the parameter scrollingSpeed to 7. The default value in Smooth Div Scroll is 25.

A special thanks to turbomilk.com for letting me use these cute icons! :-)

Back to the main page