2

Why is the flip animation on the countdown not working when including the latest jQuery version instead of version 1.4.2?

Animation demo

Erik Djupvik
  • 1,187
  • 1
  • 10
  • 13

1 Answers1

0

Although I didn't see anything in the release notes, extensive testing seems to reveal that from jQuery 1.5.0 and up you have to animate background-position-x and background-position-y separately. See this question: jquery animate background position

This code works with jQuery 1.5.0:

// Animation function
function animateDigit(which, oldDigit, newDigit){
    var speed = 80;
    var pos = getPos(which, oldDigit);
    var newPos = getPos(which, newDigit);
    // Each animation is 5 frames long, and 103px down the background image.
    // We delay each frame according to the speed above.
    for (var k = 0; k < animationFrames; k++){
        pos -= frameShift;
        if (k == (animationFrames - 1)){
            $("#" + which).delay(speed).animate({'background-position-y': pos + 'px'}, 0, function(){
                // At end of animation, shift position to new digit.
                $("#" + which).css({'background-position': '0 ' + newPos + 'px'}, 0);
            });
        }
        else{
            $("#" + which).delay(speed).animate({'background-position-y': pos + 'px'}, 0);
        }
    }
}
Community
  • 1
  • 1
Resist Design
  • 4,462
  • 3
  • 22
  • 35