kreativzirkel last won the day on
kreativzirkel had the most liked content!
-
Content Count
210 -
Joined
-
Last visited
-
Days Won
1
kreativzirkel last won the day on
kreativzirkel had the most liked content!
Community Reputation
48 NewbieAbout kreativzirkel
-
Rank
GSAP broke my jaw
Contact Methods
- Personal Website
Profile Information
-
Gender
Not Telling
-
Location
Düsseldorf
Recent Profile Visitors
-
scroll-snap and ScrollToPlugin not playing nice togehter?
kreativzirkel replied to kreativzirkel's topic in GSAP
Thanks! Feared so. What is `overwrite: 'auto'` doing in your scrollTween? Also thanks for the idea of killing the tween when `wheel` event is triggered. -
Heyho partypeople, Long time no read I got another issue Blake is probably already preparing a solution for while I'm typing is. I feel like he has a 9th sense for this. Anyhow: We want to avoid using swiper or any other heavy library for our simple carousel use case. Scroll-Snap + GSAP should be enough. But, but .. but? When animating the scroll position with gsap in a snap-scroll scenario, it seems to not animate smoothly, but rather "flash" in steps. Question 1: Why is that happening? ScrollToPlugin bug or intended behavior / acceptable ca
-
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel replied to kreativzirkel's topic in GSAP
Hey @OSUblake, how does your solution (without quickSetter) differ from mine? I also use a "proxy", which in my case is the Vue data object, and on every change I gsap.set the `drawSVG`-prop accordingly. My concerns with this solution lie in: – how often is the "watch" triggered in Vue? Will the animation always be smooth? – Technically this proxy solution `gsap.set`s twice as much. Could that have impact on performance? -
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel replied to kreativzirkel's topic in GSAP
I will have to look into `quickSetter` first, I guess -
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel replied to kreativzirkel's topic in GSAP
Crazy– the "proxy part" is kinda what I'm doing, right? Just not tied so tightly to gsap Never seen quickSetter before; the return of `self` and especially the early return of `self` inside `start` and `end` functions is a mistery to me. And what is `arguments.length` – I don't see it declared anywhere. If you find the time I'd appreciate a more in depth rundown of whats going on there. Feels like I'm close to getting a new item– you know, like in Rogue-likes, where you finally get the High jump boots and can't wait to backtrack to all the places -
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel replied to kreativzirkel's topic in GSAP
It's hard to imagine that it would be that much more code to accept an object to set start and endpoint 😎 Uh, the helper funciton looks really helpful! But ultimately blending results in a single ease. I'm quite sure for this effect to work, the start- and endpoint need to be tweened separately. -
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel replied to kreativzirkel's topic in GSAP
Your solution is waaay smaller in code, I like that! But unfortunately the animation feels very different. Although my easings aren't perfect yet (the ease visualisers custom ease builder has it's limits, and my designer will give me a proper path tomorrow :D), it already feels much smoother and "organic" – I don't think you can achieve that without separate easings. You could also make random easings and timings for start and end point each rotation; you can go all sorts of crazy! -
Controlling drawSVG start and end with separate tweens/easings?
kreativzirkel posted a topic in GSAP
drawSVG: "0% 50%" is nice! But what if I want to separate easings for start and endpoint? See the codepen as an example for why this might be useful (with a workaround using vue). Maybe something like this could be implemented in the plugin: gsap.timeline({ repeat: -1 }) .set(elem, { drawSVG: "0% 0%" }) .to(elem, { ease: 'power1.out', drawSVG: { start: "100%", }, }, 0) .to(elem, { ease: 'power1.in', drawSVG: { end: "100%", }, }, 0) -
ScrollToPlugin not working with gsap v3 and vue-cli
kreativzirkel replied to kreativzirkel's topic in GSAP
I fricking luv it– except: there seems to be a copy&paste issue – 2 passages called `FAQ` with the first one talking about the GSDevtools. https://greensock.com/docs/v3/Plugins/ScrollToPlugin I hope you keep the typo/formatting styles of the "real FAQs" – find them more readable. As a designer, the typo spacings hurt my heart! The big headline `Frequently Asked Questions (FAQ)` has more spacing to the bottom than to the top; if the fix doesn't involve too much, I'd suggest flipping the values. Since I'm always complaining, I'd like to get constructive h -
ScrollToPlugin not working with gsap v3 and vue-cli
kreativzirkel replied to kreativzirkel's topic in GSAP
@GreenSock @Carl @ZachSaucier -
ScrollToPlugin not working with gsap v3 and vue-cli
kreativzirkel replied to kreativzirkel's topic in GSAP
Thanks Blake! I'm gonna use this pattern What about changing the docs? Any thoughts on that? -
ScrollToPlugin not working with gsap v3 and vue-cli
kreativzirkel replied to kreativzirkel's topic in GSAP
Thanks for the in depth reply; Only thing bothering me now is: Can we reflect that suggestion (necessaty by now) more in the v3 docs? At the top of the ScrollToPlugin Docs page is a red box with "how to install", leading to the installation page, where plugin registration is only mentioned in one comment of a code example that doesn't deal with plugins primarily. So this change gets overlooked rather easily I'd say. My suggestion is: at the end of every plugin docs page, add the following paragraph (or something similar) And maybe also add a designated -
ScrollToPlugin not working with gsap v3 and vue-cli
kreativzirkel replied to kreativzirkel's topic in GSAP
You are right, with registerPlugin it works: https://codesandbox.io/s/gsap-v3-scrollto-working-with-registerplugin-ynirn Why does it work in GSAP v2 without registering? And why does logging `ScrollToPlugin` work then? (I'm not that familiar with tree shaking) The linter-rule "no-unused-vars" applies here aswell, so it makes sense that tree shaking drops it down the line. But why didn't GSAP v2 drop it? There is a docs article for registerPlugin, but I couldn't find any mentioning on the scrollToPlugin docs page. Wouldn't it make sense to add a lin -
I get the following error when trying to scrollTo with GSAP v3.0.2: gsap-core.js?5806:3410 Uncaught TypeError: Failed to execute 'scrollTo' on 'Window': parameter 1 ('options') is not an object. at PropTween._setterFunc [as set] (gsap-core.js?5806:3410) at PropTween._renderComplexString [as r] (gsap-core.js?5806:3447) at Tween.render (gsap-core.js?5806:3188) at _lazyRender (gsap-core.js?5806:187) at _lazySafeRender (gsap-core.js?5806:200) at updateRoot (gsap-core.js?5806:2563) at eval (gsap-core.js?5806:1212) at Array.forEach (<ano
-
Nice, I found a bug! Whoop Whoop! Out of curiosity. Could you share with us what went wrong there and what you did under the hood to fix it? (Not that I will understand more then 20% of it, if I'm lucky..)