Animation "repeat: -1" and "pause" are not working as expected

[Arpi]

I have an animation which should be working without stopping, but after some time don't know why it stops without errors and starts again after page load.
 
For repeating I use this code

var tlProducts = new TimelineMax({repeat: -1, yoyo: true, force3D: true});

Is there any idea about the reason?

 

Also as you see in the attached fiddle I have a code to stop certain animation on mouseover, but it's not working well too.What's wrong with my code?

 

Please advise, Thanks in advance.

 

Edit: Animation stopping seems more obvious after hovering element.

See the Pen by L9hd88aa (@L9hd88aa) on CodePen

[OSUblake]

Look at these. You didn't say if they were independent or part of 1 timeline. And force3D is not a timeline property. 

https://jsfiddle.net/OSUblake/6wz6L9x4/

https://jsfiddle.net/OSUblake/f5r84a8z/