Search the Community
Showing results for tags 'stutter'.
Found 7 results
-
So it's more visible in Desktop than in mobile but elements are stuttering when using stagger. I have uploaded a portion in codepen and you can see it on the website I used GSAP as well: https://shoaibahmed.dev If you look at the buttons ('Check on Github' and 'Live Preview') in that website, you will see that they are stuttering just before they reach their position. Is it something I am doing wrong?
-
I can't get gsap's animation not to freeze/jump constantly on firefox if text is using background-clip:text, i included a codepen of the most simple of the animations that fail horribly on firefox ( works on chrome and opera ) anyone has some suggestions ?
-
I've been able to resolve this issue in the past by using rotation: 0.01, using x or y rather than left or top as well as force3d, etc. Can't figure out why this animation seems to jump forward every so often. I'm using this animation setup to allow export to MP4 and even stepping one frame at a time to capture the canvas shows the jerkiness even more. It's not consistent so obviously has to do with browser performance. I just can't figure out what to do to resolve it. Any ideas? Anyone?
-
Hi there, I have created this background pattern animation and it works smoothly on safari/chrome/IE but I am experiencing some kind of stutter/lag in firefox. It even causes lag outside the browser when using other programs (OS X/macbook pro). I have searched the forum and tried all possible solutions I could find (force3D:true, rotation:0.01, etc.) but no luck. Would really appreciate any help as I am stumbling in the dark here. Oh and thanks for an awesome framework! Great stuff! Note: somehow when using codepen the strokes are blurry. This doesn't happen when working on my test server: http://preview.frodoschering.nl/pattern-animation-2/ so probably unrelated to the above issue.
-
I've looked around this website and the internet at large for a little help, but I'm not sure I'm even searching for the correct thing. The problem I'm having is that the scale attribute, as it's applied inside a TweenMax.to( ), seems to stutter to the point of essentially skipping the animation to the final frame in IE9. Unfortunately the deployment environment I'm working with is Windows 7 with IE9 strictly, so my options are limited. I believe GSAP works fine in IE9 -- all of the animations work pretty much as expected on this website's showcase animations. Here's how I have my setup: 1. The page is framed by the Twitter Bootstrap Framework 2. Other scripts exist alongside GSAP: jQuery most notably. 3. The calls to TweenMax.to( ) are being made sequentially with a timed delay rather than being a part of a timeline. Most of the animations do not run over one another. Things I've tried: 1. Changing the scale value to "msTransform":"scale(1.4,1.4)" seems to have no effect -- no effect at all that is, scale no longer happens at all. I assume the value scale:1.4 makes the call to the proprietary values anyway. 2. Removing and manipulating animations around this one to isolate it as the singular animation. This exact effect was also happening with a translation when using x and y but was corrected by using left and top. Not sure if that helps determine what I might be doing wrong. I have a feeling it's not directly GSAP related but thought I might find some insight here over what could be causing the problem.
-
Hi guys, I just tried the ThrowPropsPlugin to move a MovieClip in x-direction instead of y-direction like in the example. I took the code from the example and changed every y-value to an x-value. However, it doesn't seem to work smoothly. The drag-movement is somewhat stuttered. Strangely enough, the drag-movement where the position exceeds the bounds runs smoothly. I've attached a minimal working example, maybe someone can have a look and tell me where the code goes wrong. For some reason I'm not allowed to attach any file, so I'll just upload to my Dropbox: https://dl.dropboxusercontent.com/u/289091/ThrowPropsPluginTest.fla
-
I am hopeful that someone might be able to offer a suggestion or two about how I might work around an issue that I'm experiencing. The project I am working on is most easily described as a carousel animation sitting on top of a full screen slideshow. It is designed so that when the user clicks on one of the divs that make up the carousel, the background image transitions to the corresponding image as the caousel divs tween to their next position. In IE and Firefox, the animation is perfectly smooth, but when viewed in a Webkit browser, there is a stutter in the carousel motion occurring at the same point that the new background image begins tweening its opacity. Because the background images are full screen, it's my assumption that the stutter is a result of the browser rendering the image and not having to do with the tweening of the carousel panels, but the effect is clearly visible in the tweening. I have tried adjusting the timing of the background transition, starting it slightly before the motion and slightly after. I have also reworked the background animation plugin (anystretch and later vegas) to use gsap for its opacity tween in place of jQuery. I then reduced the height/width of the background images (Though they are still being displayed full screen), and also compressed the jpgs to the point of artifacts in an attempt to reduce file size. I have found a bit of success by swapping the background images for 10px single color squares, though it's not a viable solution. I have put together a fiddle, more like thrown it together from bits and pieces in an attempt to demonstrate the issue. The example can be seen here: http://fiddle.jshell.net/jm23r/35/show/ Does anyone have an idea about how I might either optimize this process specifically for webkit, or more generally reduce the resource utilization in order to smooth out the motion?
