Search the Community
Showing results for tags 'infinite scrolling'.
Found 2 results
-
Hi, I have an infinitely scrolling container which appends elements to the container, after an ajax call. I am trying to fix 2 issues here, as you can see on scrolling to the bottom of the container. 1. I have the even and odd cards being animated separately, but on appending new elements to the container the cards do not animate as expected and go in reverse direction. Also, as we load more and more elements in the container, the movement of cards slows down. 2. On appending elements from next page, some times the cards get overlapped, resulting in not so seamless experience. Please help me to fix these issues with this implementation of ScrollTrigger. Thank you. -
Hello, I have been performing some tests with the new v12 engine, its quite awesome really. So I'm trying to create an infinite scrolling background effect. I have a repeatable background divided in 3 divs and I'm animating all of them at the same time, whilst resetting their position and repeating. $("#button").live('click',function(){ TweenMax.to($("#child1"),10,{css:{left:$("#child1").position().left-1500},repeatDelay:0,useFrames:true, repeat:-1,onComplete:function(){ var left = $("#child1").position().left; console.log('has gone to: '+left); if(left<0){ $("#child1").css({'left':1500}); } }}); TweenMax.to($("#child2"),10,{css:{left:$("#child2").position().left-1500}, repeatDelay:0, useFrames:true,repeat:-1,onComplete:function(){ var left = $("#child2").position().left; console.log('has gone to: '+left); if(left<0){ $("#child2").css({'left':1500}); } }}); TweenMax.to($("#child3"),10,{css:{left:$("#child3").position().left-1500},repeatDelay:0, useFrames:true,repeat:-1, onComplete:function(){ var left = $("#child3").position().left; console.log('has gone to: '+left); if(left<0){ $("#child3").css({'left':1500}); } }}); }); When the animation plays at 0.1 speed the effect is smooth but quite fast. When I try to slow down the effect it staggers at each repeat. Also tried with TimelineMax/Lite same thing, tried with useFrames:true, slightly better but above delay:12 it staggers again. Am I doing something wrong or anyone has any idea how can I tottaly control the playspeed and have a smooth animation? you can view this here: http://netgfx.com/trunk/scrollingBG/ Thanks in advance.
