Search the Community
Showing results for tags 'rem'.
Found 2 results
-
Hello, I am trying to animate using rem units and am encountering unexpected behavior. In short, I'm doing this tween: TweenLite.to("#blue-circle-1", 1.2, { delay: 0.2, left: '-1rem', top: '4rem', ease: Elastic.easeOut }); But the blue circle actually ends up at top:0px, left:0px instead of the expected left: -1rem, top: 4rem. This is demonstrated in the codepen http://codepen.io/anon/pen/mJmeMa. Interestingly, if I run the same exact Tween again, after the first failed Tween, it will go to the proper position. In addition, when trying to do the same thing with EM units, as seen at this codepen http://codepen.io/anon/pen/zGwvPd, we see that the element does reach the correct position of left: -1rem, top: 4rem, but the animation itself is not fluid, it looks like it has teleported. And finally, the same animation works perfectly using the jquery animate function, doing what I'd expect it to do. See at this codepen: http://codepen.io/anon/pen/bdWVKN Can anyone explain why this is happening, or is this a bug? Thanks!
-
Hello all, In my new project, I am trying to make animations with rem units, but I have encountered a problem. I code an example on codepen.io:http://codepen.io/Sophia-xueer/pen/jqewJN?editors=1111 In this case, the 'width' animates normally, but the 'border' has an unexpected behavior, which changes from a very big value, not the value of css. I found if I use px units or set the start values before tweening, it worked. But it's a bit complicated when I make some complex animation. Is this a minor bug? And whether it will be fixed in the next version ? Any help very much appreciated! Looking forward to your reply.
