iamrufus Posted June 22, 2020 Share Posted June 22, 2020 Hi Greensock Just looking for some advice regarding setting some styles using gsap.set, I'm slowly getting to grips with gsap so bare with me I have about 4 elements i would like styled on page load, i currently have it like this let serviceName = document.querySelectorAll('.service--name'); let serviceImgMain = document.querySelectorAll('.service--image--main img'); let serviceImgBackLeft = document.querySelectorAll('.service--image--back--left'); let serviceImgBackRight = document.querySelectorAll('.service--image--back--right'); let currentSlide = 0; gsap.set(serviceName[currentSlide], { opacity: 1, duration: 0 }) gsap.set(serviceImgMain[currentSlide], { scale: 1.2, duration: 0 }) gsap.set(serviceImgBackLeft[currentSlide], { xPercent: -25, duration: 0 }) gsap.set(serviceImgBackRight[currentSlide], { xPercent: 25, duration: 0 }) I just wondered if there was a better way to write the above? I know i could quite easilly set the styles in css but because i wanted to keep all the styling for this slider done in gsap Also on a side note i have noticed that my tweens in firefox don't appear to be very smooth compared to safari and chrome. Is there anything i could do to increase performance in firefox? Appreciate any advice Thank you Link to comment Share on other sites More sharing options...
ZachSaucier Posted June 22, 2020 Share Posted June 22, 2020 Hey Rufus. You can remove the duration: 0 from each tween - there's no point in adding it as it is ignored. 25 minutes ago, iamrufus said: i have noticed that my tweens in firefox don't appear to be very smooth compared to safari and chrome. Is there anything i could do to increase performance in firefox? That's a browser issue and there may or may not be anything you can do about it. You could try adding force3d: true on some tweens that aren't forced to be 3d. Maybe try using will-change on some elements that are animated. Hard to say without being able to see it Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now