shalildev Posted July 29, 2023 Share Posted July 29, 2023 Hello there, I have a question, on the page load I see the text already shown and then the animation starts, ideally I don't want to see the text right away and just animate it in, am I doing something wrong or? See the Pen PoxxJPp?editors=1010 by shalildev (@shalildev) on CodePen Link to comment Share on other sites More sharing options...
Solution akapowl Posted July 29, 2023 Solution Share Posted July 29, 2023  Welcome to the forum.  2 hours ago, shalildev said: am I doing something wrong or?  What you're seeing is an FOUC - a flash of unstyled content. It's not wrong per se, but more of a logical result of how your code gets processed - it's explained in a bit more detail in the video on the page linked below.   There's multiple ways you can handle a situation like that, and different scenarios may require different approaches. See the Pen OJaazPL by akapowl (@akapowl) on CodePen  2 Link to comment Share on other sites More sharing options...
shalildev Posted July 29, 2023 Author Share Posted July 29, 2023 Thank you so much @akapowl this is exactly what I was missing 2 Link to comment Share on other sites More sharing options...
jlin Posted March 11 Share Posted March 11 Sorry to add to this solved thread @akapowl, but I ran into some odd behavior trying this pen with buttons.  See the Pen GRLZOpo by jade_lin (@jade_lin) on CodePen  This is more of a CSS question than GSAP, but if you delete some of the!important attributes from the button CSS, somehow showing the button from a "hidden" visibility state causes many button values to be lost.  Is normal or expected behavior?  When I don't apply the visibility: hiddenattribute, the button shows as normal... Link to comment Share on other sites More sharing options...
Rodrigo Posted March 11 Share Posted March 11 Hi @jlin,  I read your post a few times and checked your demo and unfortunately I can't seem to understand what's the issue you're having. 10 hours ago, jlin said: somehow showing the button from a "hidden" visibility state causes many button values to be lost. What exactly you mean with this? What button values?  Happy Tweening! Link to comment Share on other sites More sharing options...
akapowl Posted March 11 Share Posted March 11 You are loading tailwind.css via the settings in the HTML section. Without tailwind, the !important statements don't matter at all, it seems. So it looks to me like it is actually more of a tailwind question; and you'll have to find out what tailwind does to your button. To be honest, asking a plumber why the lamp in your living room is flickering, might not be the best approach for seeking help. If you can not find the issue yourself, I'd suggest asking in one of tailwind's support channels, e.g. their discussion forum on GitHub. https://v1.tailwindcss.com/community https://github.com/tailwindlabs/tailwindcss/discussions 2 Link to comment Share on other sites More sharing options...
Rodrigo Posted March 11 Share Posted March 11 Love the plumber analogy @akapowl, your post earned a Gif! 2 Link to comment Share on other sites More sharing options...
jlin Posted March 14 Share Posted March 14 On 3/12/2024 at 5:37 AM, akapowl said: To be honest, asking a plumber why the lamp in your living room is flickering, might not be the best approach for seeking help. If you can not find the issue yourself, I'd suggest asking in one of tailwind's support channels, e.g. their discussion forum on GitHub. https://v1.tailwindcss.com/community https://github.com/tailwindlabs/tailwindcss/discussions Apologies @akapowlI didn't noticed you responded to my question -- (need to turn on my email which I just did now). Yes, this is more of a CSS issue. I'll check in those channels, and 😆 at the GIF and analogy. 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