Search the Community
Showing results for tags 'render'.
Found 7 results
-
I'm working on a project where we are creating a tool as a sort of helper app that we can use to create an animation using HTML5/JS GSAP (not Flash version) and then export the animation with transparency for use on the web as a standalone file such as animated GIF, MOV or MP4 as a transparent layer in a video editing program. The animation tool will focus on the goodies from the DrawSVG, MorphSVG and SplitText plugins. So, obviously we would chain together a bunch of GSAP scripts and then try to capture the completed animation playing inside a specific container using some sort of rendering process that gets converted into the above mentioned filetypes. Does anyone know of a way to accomplish this? I am working in a Node.js environment so will have all that's possible in Node available to me including file system access. I am hoping someone has already created an export tool that can be plugged in to our helper application. Thanks in advance!
-
I am working on implementation of another developer. I am not familiar with this library yet. So, this issue might be a configuration issue or something like this. It's only on iphones (tested on 4S & 6S) the svg animations are shown only when the page is scrolling! I was expecting the opposite behavior really. I have placed console messages and I figured out that the animations are applied correctly but are not rendered on the screen. When we scroll the screen even a little bit, we get the current position of the animated objects. Since we have lost some frames the animation looks like it jumps. So this means that the animations are working behind the scene. I have also placed console messages and I saw that everything is working fine and simply the dom is not updated. When I scroll the screen slowly the animations are running normally. It looks like the svg changes are blocked for performance issues??? I don't know. This happens only on iphones!!! It tested and it works on: - mac desktop (safari, ff) - win desktop (ie11!!, edge, ff, chrome) - android (chrome) is not working on: - iPhone 4s, 6s (safari and chrome!) - ipad (safari)
-
Hello, I will appreciate if you could help a newbie. At moment I perform documentation examination, and I met https://greensock.com/docs/TimelineMax/render() render() method. Could someone explain me please, what is parameter force for? Thanks in advance.
-
Hi, first of all let me say congratulations for your great job, gsap definetly changed my career by now. So... I made a codepen for you isolating one animation of our last website that do not render well on safari. Surprise! On codepen it works perfectly... I'm still writing asking for help but I will understand if you can't or do not want, due to the website has another addons like scrollmagic etc etc. I posted the codepen ( use it as reference on what we want ) and here goes the website: http://brand.uoc.edu. As you can see on Safari absolutely all goes slow and jumping. Any ideas? Thanks in advance and congrats again for the great job! PS: My apologize for the english
-
Hi ! I'm really happy to be able to use tweenmax for animation. I've noticed one issue, that is kind of hard to reproduce. Using chrome and a simple command like : `tl.to(parentClass + ' .card-2', cardAnimInDuration, { scale: 1, left: 0, top: 0, rotation: -5, ease: Expo.easeOut, delay: delayDuration }, 'cardsIn')` produce a nice animation which render perfectly in chrome. In chromium it is also perfect. But in some version of Electron, the content is not visible due to an error in the matrix transform. The produced matrix transform is as follow : chrome 51.0.2704 : `transform: matrix(0.99619, -0.08715, 0.08715, 0.99619, 56.9881, -22.7032);` canay chromium : `transform: matrix(0.99619, -0.08715, 0.08715, 0.99619, 56.9881, -22.7032);` electron 1.2.3 : `transform: matrix(0,99619, 0,08715, 0,99619, 0,08715, 0, 871557);` You'll notice that the "." dots are replaced by commas... and this breaks the transform property. I'll be happy to get some help on this issue. Thanks !
-
Hi all! I'm in last time interested TweenMax for performance. I'm using TweenLite/Max from 2013 June, but 2013 TweenLite/Max are slowly. The new 2014 August TweenLite/Max performance high, smooth 50+ fps (if H/W accelaration is disabled) and very-smooth without breaking frames 60 FPS and 60 Hz rendering (if H/W acc. enabled). In latest GSAP (TweenLite/Max and etc) have some issues in IE! 1. Dx and Dy in relative position cutting when transformating. 2. CSS3 rendering - borderRadius, boxShadow, backgroundGradient, textShadow doesn't work 3. CSS3 Transform - rotateX, rotateY, translateZ, scaleZ doesn't work. Have issue fixes! 1. Set position to absolute. 2. borderRadius, boxShadow and backgroundGradient pollyfil have (i'm now upload to GoogleDrive, see https://googledrive.com/host/0B7DKrzLvYDoOV1ZzZ3ZRMTdwbE0) in IE! 3. CSSMatrix uses advanced calculating and making 3D in IE (see https://github.com/arian/CSSMatrix ) Thanks!
-
I have a simple splittextfield animation that animates some letters into place. Once complete, I call the destroy() method on the stf, returning the original textfield into place, as I need to dynamically update the contents of the text field as the program is running. When the destroy() method is called, and the original textfield is returned, there is quite a noticeable difference in how the text is rendered between the original text field and the splittextfield. It appears that the stf renders the font slightly thicker. Is there a solution or setting that will resolve this? Regards Simon
