Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Posts

  • Joined

  • Last visited

Everything posted by Mantvydas

  1. Hey @Jonathan, Thank You for Your answer. This is what I needed to know
  2. Hey @PointC, Thanks for response. You intrigue me with Your answer because most of the times animation is sluggish the first time. I am not using timeline, I am using separate tweets. How I can use this progress without timeline? Thanks
  3. Hello guys, I was wondering when animating an element, better performance would be animating absolute positioned element or doesn't matter? Now I am working on one animation where I use basic animation on x: TweenMax.to(['#element1', '#element2'], .7, {x:350}); These 2 elements has basic positioned, its not absolute or anything. But sometimes animation is really sluggish..
  4. Not the answer I was looking for but thanks for trying to help
  5. Dear GreenSockers, I have been making button animation for mobile navigation. Looks everything nice, but sometimes when you don't wait until animation end and you press button again, animation breaks and in the end I have this (see image). What I am doing wrong here?
  6. Sure Visual-Q, here you go. Actualy nothing helped to me so I finally found my own small hack. To parent div I added: border:1px solid black; And for children (door) I added 1px extra to the height and 2px extra to the width and also I set left to -1px. And voilà! Its worked for me, no more those ugly outlines
  7. It really smoothed things up on Mozilla. Thanks Craig!
  8. Yesterday when I removed 'transition: all 1s ease;' and animate it with GSAP, these outline 'ghost pixles' gone, but there is one last problem with that door animation. When I open the door on Mozilla, top and bottom lines get pixelated, not smooth at all while on all other browsers these top and bottom lines of the door are much more smoother.
  9. Was thinking the same. Thank you for spending your time just to help me out. I really appreciate it You said "I've seen it before on other '3d' objects in chrome where items need to line up perfectly". What you mean by saying items need to line up perfectly? Line up with what? Sorry for asking these kind of questions, I am still kind of beginner in coding.
  10. Hmm, when I removed 'transition: all 1s ease;', ofc there is no more animation, but lines are gone!
  11. Here You can see these lines. Sorry Jack, I just tried to add GSAP on main code, didnt add to codepen. And with border still the same. Can it be that only on my pc these lines appearing? How I can make same action using GSAP? Or for such animation there is no need to use GSAP?
  12. On Chrome and Opera after animating (opening) div (door) lines around that div appears. Tried adding translateZ(0), but then even worse - lines appears after page loads, you don't even need to animate.. On Mozilla and Edge seems fine. Can GSAP fix this issue? I tried adding something like this on hover event: TweenMax.to(".door", 2,{rotationY:13, transformPerspective:300, transformStyle:"preserve-3d",repeat:1, yoyo:true}}); but doesnt work at all.. Thanks, Mantvydas
  13. And I thought that $(window).on('mousemove.parallax', function(event) { TweenMax.to(layer_1, 2, { x: left / 90, ease:Expo.easeOut,overwrite: 'all'}) ... }); is GSAP parallax event. Im still green on GreenSock. How to use GSAP mouse parallax?
  14. I dont need you to change my code I just needed some advice. Thanks for helpful suggestion, from now I know where to start. Thanks again GreenSock
  15. Sorry I am new to coding, I started to learn just 1 year ago.. Maybe I am using too many animations? Nut I have seen websites with much more animations and was performing much better than mine. Maybe I have too much layers? Or my JavaSCript is not good? Even when hovering on navigation items is very laggy. What is wrong here? On Opera is best performance, Chrome and Mozilla average but on edge is disaster, even when scrolling some white lines on the top pops up.. This is my portfolio project codepen. It is still not responsive so layout on big or too small screens can be broken and if you can watch this code on full screen, because I am using 100vh it can also look broken layout, sorry for that.. What I should change here? Thanks, Mantvydas
  16. Guys, this animation still costs me a lot of fps. It is possible to make it as infinite svg animation? Would it be better performance? Or there is any other way to make this infinite animation fps friendly?
  17. Hey OSUblake, Wow, what a nice animation. I would like to know how to work with canvas, but there is not much tutorials about it.. I really interesting in it but what I can do its just draw a line with canvas..
  18. Thank You so much! You helped me a lot. Your forum is the best help resource out there. I appreciate what You are doing here! Thanks do much, Mantvydas
  19. Hello professionals, I need Your help changing this animation for better performance. When I use this infinite animation on my website, I lose 20/30 fps from 60 fps. Can I change this CSS animation to GSAP animation? Would it be better performance? And if it would be, how I can make same skew infinite loop with GSAP? I tried to make it with GSAP but I can only make animation from left to right, how to make this skew motion? Thanks, Mantvydas
  20. Hi guys, Sorry if this is not right question in this forum, but I hope you can help me. I need to achieve such nice gradient glow as in picture. I made this in photoshop and I tried to do same with CSS but I cant make it. With CSS you still can see edges of circle, I want it to fade 100%, like in picture. Also in picture center of the circle is more bright mine is all same. It is possible to make exactly same glow as in this picture? Or this is max what I can achieve with CSS? So maybe I can achieve this with GSAP? Thanks, Mantvydas
  21. Shaun, thank You so much! Didn't thought about this. You helped me a lot! Thanks
  22. Hi guys, I have issue on Mozilla with text animation. On Chrome and all other browsers works fine (in Microsoft Edge all animation in general is laggy, very low performance) but on Mozilla text animation is jerky and jumping. But div's/boxes animation on Mozilla works just fine, I don't know what is wrong here. I added rotation: 0.01 but still same jumping on text. How I can solve this problem? Thanks, Mantvydas