iOS Animation Issue

[Joe]

Hello,

 

First off, thanks for all the work on this great API.

 

I've looked at many of the past posts on this topic and can't seem to find a remedy for my issue. I'm using a simple move tween with a bounceOut on a fixed position div, which works great on everything but iOS devices. I've tested on an updated iPad 1 (iOS 5.1.1), iPad 2 (mini, iOS 6.1.3), and an iPhone 4 (iOS 6.1.3). This is in both Safari and Chrome (both the most updated versions), and I'm using the most current release of GSAP JS (TweenMax.min.js).

 

Could this be an issue with the way I'm calculating scroll positioning?

 

jQuery(document).ready(function($) {
    //disables the requestAnimationFrame functionality and causes GSAP to use a simple setTimeout() internally (pretty much like jQuery).
    TweenLite.ticker.useRAF(false);
    var winHeight = $(window).height(), 
        socPos = winHeight - $('#socialBox').height();
    $('#socialBox').css('top', socPos);
    $(window).bind('scroll', function(e) {
        scrollBinder();
    });
    function scrollBinder() {
        var winScroll = $(window).scrollTop(), 
            winHeight = $(window).height(), 
            docHeight = $(document).height(), 
            percent = (winScroll / (docHeight - winHeight)), 
            targetDiv = $('#socialBox'),
            newPos = (winHeight * percent) * (-.65);
        if (newPos > socPos) {
            newPos = socPos;
        }
        if ($(window).width() > 480) {
            TweenMax.to(targetDiv, .75, {
                y : newPos,
                ease : Bounce.easeOut
            });
        }
    }
});

[Carl]

Hi and welcome to the GreenSock forums.

 

I would suggest putting in some debug mechanism prior to the tween being created that lets you know what the value of newPos is. Then you could at least know

 

1) if that condition is being called

2) if newPos has the expected value

3) exactly where your code might be breaking

 

Also maybe the tween is running but something is preventing renders or the target from moving. I would also add an onComplete callback to the tween that will display a simple message like "tween complete". 

 

And although seemingly obvious, I would remove all code but the TweenMax code just to make sure the basic tween works. 

 

Let us know if you come up with any info that would be helpful