Animate jumps to end if starting position is negative percentage in Safari

[spiralian_universe@…]

This only happens in Safari. If I set the margin of the animated element to negative percentage and call an animate on that object later, the element jumps to the end position.

$('#a').css('margin-left', '-3.1231230%'); $('#a').animate({"margin-left": "-100%"}, 1000)

Looks like when reading the property, inside the FX, it is messed up by the the fix under the line A tribute to the "awesome hack by Dean Edwards"

[sindresorhus]

Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, use this boilerplate:  http://jsfiddle.net/FrKyN/ Open the link and click to "Fork" (in the top menu) to get started.

[trac-o-bot]

Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!

[anonymous]

+1

jquery 1.7.2 & 1.8.0 - not fixed

list.find('li:eq(' + newI + ')').css({'margin-left':'-100%'}, 1000).animate({'margin-left':'0%'}, 1500});

safari have bug

[mikesherov]

I'm unable to reproduce, which version of safari are you using?  http://jsfiddle.net/kUtj7/1/

[trac-o-bot]

Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!

[weigel@…]

This bug with negative percentage margins still exists: Safari 5.1.7 Windows. Can reproduce this bug with  http://jsfiddle.net/kUtj7/1/ from above. It works in every browser except Safari on Windows.

[anonymous]

To avoid this issue, use CSS Transitions for modern browsers and jQuery animate for the rest. Use modernizr to find out if the browser supports transitions.

if( !Modernizr.csstransitions ){

$('#gallery .slides').animate({"margin-left":'-200%'}, 750);

} else {

$('#gallery .slides').css({"margin-left":'-200%'});

}