Opened 11 years ago
Closed 10 years ago
#11982 closed bug (notabug)
JQuery animate() issue when another animate is called from within the step function.
Reported by: | Owned by: | gnarf | |
---|---|---|---|
Priority: | low | Milestone: | None |
Component: | effects | Version: | 1.7.2 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
I am having this weird behavior when trying to stop an animation, set the tweened property to another value inside a step function, and then start the animation again.
If you run the code below, when the condition is met in the step function, it should only show the logs once. What actually happens is even though I stop the animation and start it again (by calling autoScroll() in the step function), it's almost like the animate() leaves off where it was stopped even though I changed the value of the tweened property to something else before starting the animate() sequence again.
var obj = {left:0}; function autoScroll(){ $(obj).animate({left:'-=100'},{ duration:1000, easing:'linear', complete:autoScroll, step:function(){ if(this.left < -80){ $(this).stop(true); this.left += 80; console.log(this.left); console.log('stop'); autoScroll(); } } }); autoScroll();
Change History (8)
comment:1 Changed 11 years ago by
comment:3 Changed 11 years ago by
Owner: | set to [email protected]… |
---|---|
Status: | new → pending |
I'm really not sure what the bug is supposed to be here... http://jsfiddle.net/WMqCg/5/ When it starts it is at the value you set it to...
comment:4 Changed 11 years ago by
Status: | pending → new |
---|
It is hard to catch, but a couple things to point out.
- the step function is being called 'before' the actual property is updated.
- when the animation is stopped and restarted, it updates the property based on a cached stored value from the previous animation. (on the second step) since the first step of an animation is a distance of 0 from the starting point.
I hope I am making sense.
here is an updated fiddle and a sample of the output with comments to point out the issue.
http://jsfiddle.net/WMqCg/19/
step value: -77.8
actual value: -76.5
step value: -79.10000000000001
actual value: -77.8
step value: -80.4
actual value: -79.10000000000001
step value: -81.69999999999999 <~ last value set before condition.
actual value: -80.4
stopped += 80 -0.4000000000000057
step value: -0.4000000000000057 < first step call of new animate().. (before property is updated)
actual value: -0.4000000000000057
step value: -1.8000000000000058 < second step call.. (after the first update)
actual value: -81.69999999999999 < why would it jump back up to this value? it should be 0.4000000000000057.
stopped += 80 -1.6999999999999886 < called a second time since the property was animated from the last stored value causing the condition to be true.
comment:5 Changed 11 years ago by
to make it easier to read..
step value: -77.8 actual value: -76.5 step value: -79.10000000000001 actual value: -77.8 step value: -80.4 actual value: -79.10000000000001 step value: -81.69999999999999 <~ last value set before condition. actual value: -80.4 stopped += 80 -0.4000000000000057 step value: -0.4000000000000057 <~ first step call of new animate().. (before property is updated) actual value: -0.4000000000000057 step value: -1.8000000000000058 <~ second step call.. (after the first update) actual value: -81.69999999999999 <~ why would it jump back up to this value? it should be 0.4000000000000057. stopped += 80 -1.6999999999999886 <~ called a second time since the property was animated from the last stored value causing the condition to be true.
comment:6 Changed 10 years ago by
Component: | unfiled → effects |
---|---|
Owner: | changed from [email protected]… to gnarf |
Priority: | undecided → low |
Status: | new → assigned |
gnarf, I'll let you make the call on this one.
comment:7 Changed 10 years ago by
Out of curiosity, could you try doing the same thing with the 1.8 progress callback and let me know if it has similar problems? There is a bit of strangeness manipulating the actual animation in the step callback that just has me thinking "unexpected behaviors galore"
comment:8 Changed 10 years ago by
Resolution: | → notabug |
---|---|
Status: | assigned → closed |
Since the OP hasn't replied I am assuming it's either fixed, not a bug, or not urgent.
sorry for posting the code.. here is the example.
http://jsfiddle.net/WMqCg/