[Animation and positioning corrupts when changing tab and back]

Hello Carl.

 

Yes, that's it - I implemented the set-line as you suggested. I've been testing the ads for the last 15 minutes and cannot get them to fail anymore.

Regarding the timer; I use a standard JS setInterval - but I'll make sure to have the delayed call in mind, next time.

 

Thank you for your swift assistance.

[Animation and positioning corrupts when changing tab and back]

Hello experts.

 

I'm having trouble with some ads, I've recently created.

If you take a look at this, it looks ok at first glance: http://coop.nmd.dk/banners/placeholders/targetgroup2/300x250/targetgroup2_300x250.html

 

If you create a new browser tab, click it, wait a little while and change back again, the animated elements get, what seems to be undeterminate positions; most often outside the stage. It happens in IE, Firefox and Chrome; haven't tested on Mac. I don't see any particular pattern. Can you help me out?

 

Every 5th second, a timer runs this. The indexer is just an integer, which in this case switches between 0 and 1

function boingInd(indexer) {
            var i = "#image"+indexer;
            var j = "#outerUsp"+indexer;
            var k = "#calltoactionf"+indexer;
            
// Apply the original style to the objects, so that they are positioned as they should appear in the banner
            document.getElementById("image"+indexer).className = "image";
            document.getElementById("outerUsp"+indexer).className = "outerUsp";
            document.getElementById("calltoactionf"+indexer).className = "c2a";
           
// When this is done, animate them from outside the canvas area and to the positions, just assigned.
            TweenLite.from(i, 1, {delay:0.1, y:200, ease:Back.easeOut});
            TweenLite.from(j, 1, {delay:0.3, y:200, ease:Back.easeOut});
            TweenLite.from(k, 1, {delay:0.5, y:200, ease:Back.easeOut, onComplete:allowChange});
}

See the Pen 300x250 by banners (@banners) on CodePen