Eunomiac
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
And you should be able to position both elements without misalignment if they're both children of a
position: relative parent -- and assuming you set their positions identically, of course.170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Yeah ideally you want the DOM structure (including the stacking context, set via
position: relative on the parent) to be identical for both of the elements you want to align.170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Ahh, I see -- the element is being centered horizontally in the second case, which was causing that 0.3px offset
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Maybe consider a parent wrapper element set to
position: relative, and then set both the pre and post positions via position: absolute?170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
That might be why -- if you're trying to align two differently-positioned elements, that can be tricky, especially if some of their dimensions are floats -- like that 174.594
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Hmm. What does the style inspector in the dev console show? Any differences in the box positioning?
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
0.7px off position-wise? Set
font-size: 0 in the parent element -- sometimes a simple white-space can cause that170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Ahhhhh, that makes sense -- so
oldState was being animated out and in at the same time170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Was it the use of both
autoAlpha and opacity that was causing the problem? That would be my suspicion.170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Especially when building timelines.
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Also I just want to reiterate that I've never liked
gsap.from --- I always seem to run into problems with it. I exclusively use to and fromTo.170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
(Changed
opacity to autoAlpha in my above example, just FYI 🙂 )170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Oh, so it is resolving. Try using
fromTo wherever you can --- tl.fromTo(this.oldState, {autoAlpha: 1}, {autoAlpha: 0, duration: 0.5} ...
And don't use both opacity and autoAlpha --- autoAlpha handles opacity and visibility, so it's redundant to include opacity as well. (That might actually be causing the problem, I'm not sure)170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
It might be that
this.oldState isn't resolving to the element. Try using a selector, or re-fetch the element right after that await super._onRender call170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Once you confirm that, add back in the GSAP. If the flash reappears, then yeah, GSAP is doing something weird.
You can also try using
You can also try using
fromTo instead of from -- I find it's more resilient because you're setting the start and end points. E.g. gsap.fromTo(this.element, {autoAlpha: 0}, {autoAlpha: 1, duration: 0.5})170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Exactly. And that would confirm that the styles and DOM manipulation are working properly --- if you see nothing, no flash, nothing at all, then you know that you've correctly rendered the element to the DOM invisibly, so it's ready for GSAP to animate it back in.
170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
So, despite the element having a CSS-set style of
visibility: hidden, it still flashes? That's bizarre. And it shouldn't have anything to do with GSAP --- i.e. if you remove all of the GSAP (or comment it out briefly ot test), you should still see that flash170 replies
LOELeague of Extraordinary FoundryVTT Developers
•Created by Eon on 4/15/2025 in #development
@Eunomiac Sooo I finally got around to
Wait, that's not how the saying goes
170 replies