Jump to content


iOS Animation Issue

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts



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).
    var winHeight = $(window).height(), 
        socPos = winHeight - $('#socialBox').height();
    $('#socialBox').css('top', socPos);
    $(window).bind('scroll', function(e) {
    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
Link to comment
Share on other sites

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

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.