I'm trying to make a autoscrolling/carousel like function for an unordered list of images.

When you mouse over the containing div its calling a function that's job is to animate the margin on the <ul>

$(".thumbs").animate({"margin-top": (currentMargin - 10) + "px"}, function(){
     console.log("margin-top" + (currentMargin - 10) + "px");
     running=false;
     });

I'm seeing the correct value for what I want in the log ie the animation thinks its finished... but nothing is changing on my div.

Does anyone have any insight as to what might make the animate function not work as intended?

Thanks

I'm trying to make a autoscrolling/carousel like function for an unordered list of images.

When you mouse over the containing div its calling a function that's job is to animate the margin on the <ul>

$(".thumbs").animate({"margin-top": (currentMargin - 10) + "px"}, function(){
     console.log("margin-top" + (currentMargin - 10) + "px");
     running=false;
     });

I'm seeing the correct value for what I want in the log ie the animation thinks its finished... but nothing is changing on my div.

Does anyone have any insight as to what might make the animate function not work as intended?

Thanks

• javascript
• jquery
• animation
• effects

1 Answer 1

try using "marginTop" instead of "margin-top". Normally when you use the CSS props as "border-something" or "margin-something" is better to use the "normalized" version of it, as you used to do it in DHTML (styles.marginTop).