Jump to content
GreenSock

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

wpsoul

BusinessGreen
  • Posts

    54
  • Joined

  • Last visited

About wpsoul

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

wpsoul's Achievements

  1. Yes, this is what I used before. Problem with this function is that it kills all ST on page and I need to kill only ST of specific containers. Advantage of killTweensOf is that it has option to specify container, this is why I asked if it's killing also ST.
  2. I want to remove all gsap.to, gsap.from and attached Scrolltriggers. Is killTweensOf enough to remove all of them?
  3. Hi. I am one of developer of Rehub. If you don't use the same classes as in Rehub GSAP related blocks, then, your animation should work independently. P.s. Rehub has also Lottie block with enabled GSAP scroll possibilities (in Elementor) and new Interaction library for Lottie in Greenshift editor, so, you don't need any extra code for such task
  4. So, proper way to get correct look is gsap.set to object itself or css property to parent? I checked gsap set on site and it looks correct, does it affect performance? Do we need to assign will-change?
  5. Ok. this solved. But, I guess, that it's wrong options in documentations, because one of possible ways to add 3d as mentioned in documentation is next https://greensock.com/docs/v3/GSAP/CorePlugins/CSSPlugin#h2-3d-transforms gsap.defaults({transformPerspective: 500}); and this makes wrong animation. We must set to object and not to tween https://codepen.io/igor-sunz/pen/rNpoORy
  6. I want to make real 3d look. If I add perspective value to parent container, it looks not proper because perspective added to whole block with all childrens. But when I add transformPerspective option according to documentation, I see strange jump in end of animation
  7. This helped, scroll is much smoother and I don't see huge perfomance drop over area with product grid. I have one more question, because I see similar perfomance problem with scrub parameter and ScrollTrigger. Imagine I have 10 elements on page and all of them have different animations for GSAP. Is any difference in perfomance if I make 10 timelines and attach timeline to ScrollTrigger.create OR I make 10 gsap.from({scrollTrigger:{...}},...) ?
  8. I don't think that parallax or css is the reason because parallax is made on GSAP and part of page where I see some jumping has no animations. I removed all scripts except GSAP and removed all css transitions. And I still see some jittering over part where I have product grid. The only difference from other parts is that it has a lot of DOM elements (prices, buttons, images, etc). Interesting thing that I tried the same page on my computer which has much better GPU and I don't see issues. So, it's something GPU related or OS related. I have problem on Macbook PRO, but it has good enough card with 8GB and powerful CPU. P.s I tried your feature with section option - it didn't help. Please, note, you need to test on full screen. Click on "Edit on Codepen" for this.
  9. I tested smoothscroll and it's great addition to GSAP. And it works greate on pages with big elements. But I found huge perfomance drop on pages with many small elements a a lot of DOM elements. I copied whole page of site so you can see. When you scroll over section with product grid, perfomance is dropped down and I see huge jumping while scroll. When scroll is over next elements - it's restored (but still not perfect). Is any dependencies in ScrollSmoother on elements for page? Ps you can see better what I mean if you open Codepen in full page (looks like compact look has no such issue).
  10. I definetely know that problem in Scrolltrigger, because animation is working good without it. So, Scrolltrigger is very sensitive to DOM levels and number of items on page. Will-change parameter helps a bit if there are just several animations (near 5, but not more than 10). I have also some thoughts that this can be related on conflicts with Scroll trigger and libraries which are used in Wordpress. Maybe jquery which is not latest in WP? I will try to make tests on site without extra plugins and with simple theme + deactivate jquery.
  11. It's helped on codepen but not in wordpress editor which has too complex panels with several scrollable fixed zones and injected items. This hack makes scrolltrigger detecting correct position, but animation and scroll is going crazy. So, I give up in this, maybe I will try in future again
  12. Problem is not in animation, because it works good if it's used on load or on other triggers (not Scrolltrigger). Also, will-change parameter can be used only on few elements on page, otherwise, it will make more problem that solve them.
  13. As I mentioned in my initial message, this plugin is for Wordpress Editor (which is used on 60% of sites in internet) and we can't control structure of editor layers and styles of skeleton. Currently I just need to know if there is any possible way to make it works or 100% no chance.
  14. Wanted to make the same topic. This is problem which I fight for months with GSAP. Interesting that when I tried to make minimal demo, everything is working perfect. After many tests, I found that perfomance and jumping is going only on real sites where I have a lot of DOM elements. I found this on some testing environment, where I have enabled debug plugin which has a lot of containers with hidden information. And also on pages where I have huge mega menus. So, even if DOM elements are hidden (or sticky) I see huge perfomance drop and this weird jumping effect, especially on large blocks (like you have on your site) and especially if I have several animations close together (for example, big container with parallax and small blocks inside this container with simple reveal effect). here is my example https://refashion.wpsoul.net/ Animations on first screen are made on load (without Scrolltrigger) and it's more smooth than animations on second screen when I have parallax with Scrolltrigger P.s want to add that Firefox, Opera work much better, the biggest issues are in Chrome
  15. Unfortunately, I need get back to this question. Scrolltrigger.refresh is detecting proper position of items which are on screen, but when I start to scroll, everything is messed up again. I tried to replicate the same structure of containers like in Wordpress but for demo of plugin. And yes, it's also not working properly. Only first element which is on screen while loading has proper behaviour. I took official demo as base of Scrolltrigger and wrapped it with containers like in Wordpress editor https://codepen.io/igor-sunz/pen/qBPRQpm
×