I'm developing a little roulette game.
My question is, the roulette animation used with transform & transition, works pretty well when I'm in the actual tab.
The problem is, when i move to another tab or miniminize, before the roullete starts, until i dont get back to the tab, it dosnt start scrolling / moving.
Is like the roullete animation is waiting until i get to the tab again, to start moving.
$(this.refs.slider).css(*transform', 'translate3d(-7' + DB.rouletteSpin + 'px, 0px, 0px)');
$(this.refs.slider).css('transition', '15000ms cubic-bezier(0.32, 0.64, 0.45, 1)');
That's the code, and i think the problem it could be cause im using this in a setInterval?
The DB.roulleteSpin is just a simple code that comes from the Database.
How I could approach this situation? I will like to know the roulette starts moving and ends in the right place, no matters if I'm in the tab or not.
I should use some animation library, like TweenMax or something?
Someone know how to solve this? Sorry if i dont explained it properly, you can ask me if u guys didnt understand something.. Thanks!