Bug Tracker

Ticket #7287 (closed bug: duplicate)

Opened 4 years ago

Last modified 3 years ago

-10000px bug for jQuery.animate

Reported by: yuxel@… Owned by:
Priority: low Milestone: 1.5
Component: effects Version: 1.4.3
Keywords: -10000px bug animate Cc:
Blocking: Blocked by:

Description

Hi, First of all thansk for building jQuery.

I'm trying to make an animation using .animate. But when I try to move to "margin-left","-10000px" it starts animating from first pixel or lets say I'm seeing content of first pixels.

You can try it from here :  http://gist.github.com/640615

When margin-left set less than -10000px i'm seeing "TextTextText", but when I try it over -10000 such as -9999 it works fine.

Change History

comment:1 Changed 4 years ago by addyosmani

  • Keywords -10000px bug animate added
  • Status changed from new to closed
  • Resolution set to worksforme

Your code is working fine for me in Safari and Firefox. By the looks of it this may actually be more of an implementation bug in what you're trying to achieve in your code than a discernible jQuery core issue. If you could kindly submit your request for assistance/review over at the jQuery forums, another member of our team would be happy to assist.

comment:2 Changed 4 years ago by fahd828@…

I have this exact same bug. I have a list of horizontal images that I scroll through. Once I set the margin-left less than -10,000px it animates the list from the first picture to the next as described by the poster.

I can't give a link to see this since its on my development branch.

comment:3 Changed 4 years ago by dmethvin

  • Status changed from closed to reopened
  • Resolution worksforme deleted

comment:4 Changed 4 years ago by dmethvin

  • Status changed from reopened to closed
  • Resolution set to duplicate

comment:5 Changed 4 years ago by dmethvin

Duplicate of #7193.

comment:6 Changed 4 years ago by anonymous

+1

Have the exact same bug. Only happens on -10,000px and behaves exactly as original poster describes

comment:7 follow-up: ↓ 8 Changed 4 years ago by anonymous

Same bug here. above -10 000, animations ignore the current value that must be animated and start from 0 instead.

comment:8 in reply to: ↑ 7 Changed 4 years ago by anonymous

I have the very same issue, using the relative syntax (fx: { left : '+=1000' }) performs a little better but also doesn't produce expected results. really a showstopper

comment:9 Changed 4 years ago by anonymous

+1 It also happens with 1.4.4

comment:10 Changed 4 years ago by Tom

I know how to fix it but I don't understand what I'm doing exactly, so maybe someone can help.

Get the uncompressed jQuery, look at line 6624:

return r && r > -10000 ? r : 0;

Does that mean it returns 0 if larger than -10000 or something?

It's part of the "cur function()" ("Get the current size" says its comment) and this function is used inside the animate function in line 6472:

start = e.cur() || 0;

I needed a quick fix, so I changed

return r && r > -10000 ? r : 0;

to

return r && r > -1000000 ? r : 0;

and this seems to work for now.

comment:11 Changed 4 years ago by akmjenkins@…

Huge bug. This takes a half a second to fix so that we don't have to hack our own development versions and won't be able to upgrade to future versions automatically (we'll have to fix the bug first and then re-minify the new version of the library).

To the dev team, please, it takes a half a second to add the extra 0 that Tom pointed out. Fix the library and put out 1.4.4.1!!!!

comment:12 Changed 4 years ago by anonymous

I confirm the bug in 1.4.4 Tom's fix works fine.

comment:13 Changed 4 years ago by ajpiano

comment:14 Changed 4 years ago by adam.libonattiroche@…

Does anybody know when the google version will have this update applied to it?

comment:15 Changed 4 years ago by ajpiano

Once the next version of jQuery is released.

comment:16 Changed 4 years ago by jitter

  • Priority changed from undecided to low
  • Component changed from unfiled to effects

comment:17 Changed 4 years ago by peteklein23@…

Hey everybody. If / until the this bug gets fixed, a better way to completely remove the limit is to overwrite the function in a different file. That way, when the next version of jquery comes out, you don't risk overwriting you change and breaking the code. My buddy Andy at work helped me write this code, so if you need to have the -10000 pixel limit completely removed, use this code.

$.fx.prototype.cur = function(){ // we are overwriting this function to remove limiting of the size of the

    if ( this.elem[this.prop] != null && (!this.elem.style || this.elem.style[this.prop] == null) ) {
      return this.elem[ this.prop ];
    }

    var r = parseFloat( jQuery.css( this.elem, this.prop ) );
    return typeof r == 'undefined' ? 0 : r;
    
}

comment:18 Changed 4 years ago by baguspewe

Hi, I found temporary solution before we get the next release. We can use minified version of 1.4.4, find and replace this code:

return a&&a>-1E4?a:0

with

return a||0

comment:19 follow-up: ↓ 20 Changed 4 years ago by danimalia@…

In the minified version they use exponential notation, so replace this code:

return a&&a>-1E4?a:0

with this:

return a?a:0

comment:20 in reply to: ↑ 19 Changed 4 years ago by danimalia@…

Sorry just saw this was already posted!

comment:21 Changed 4 years ago by anonymous

This bug as been fixed i belive.. i no longer have this problem since jQuery 1.5

Note: See TracTickets for help on using tickets.