We help IT Professionals succeed at work.

click graphic to animate DIV inside another DIV

Brad Bansner
Brad Bansner asked
on
My page:

http://www.joiebaby.com/new/our-products.asp

The DIV productscroller is positioned absolute and has overflow:hidden. Within that, DIV productcontainer contains all the individual product blocks. Then the nine individual products are each within their own DIV with class "products".

All I want is that when the right arrow is clicked, the DIV productcontainer slides to the left 168px (inside productscroller), so that the user can scroll to see the four products that are not visible.

My functions is attached. When I click the arrow button, nothing moves at all. Would appreciate any suggestions. Thank you!
$(function(){
	$('#gr_arrow_right').click(function(){
		$('#productcontainer').animate({
			left:'-=168px'
		}, 200);
	});
});

Open in new window

Comment
Watch Question

in your css or inline css of the #productcontainer set "postion: relative;"

Brad BansnerWeb Developer

Author

Commented:
Ah, glad it was that simple. Thank you!