Creativist-Lab Posted July 22, 2021 Share Posted July 22, 2021 Hello, I'm having some problems with some of my tweens and my suspicion is that there is a conflict but I'm kinda at a dead-end with my knowledge. So my main question is what is the best way to debug when there are no errors showing in the console? I'm working in WordPress so I already switched all other plugins off, cleared all caches etc. Also I followed some examples from the forum which are working without any errors on my site but I'm getting a different result in its behavior compared to the examples. I followed on this page the example of the wrap utility function: https://greensock.com/docs/v3/GSAP/CorePlugins/ModifiersPlugin And a few other examples that should give similar results but they all behave in a similar unwanted way (so at least something is consistent ) Basically what I'm trying to achieve is having a line with text move from right to left in a endless loop I tried what I think is the easiest option first with the following code: gsap.to('.newsline', {x: -720, duration: 5, ease: 'none', repeat: -1 }) But what happens is after the first duration the tween just kinda bounces a bit from left to right you can see the live example here: Mister Bamboo Straws | Premium | Reusable | Customized branded straw | Eco friendly | Eco-friendly and reusable plastic straw alternative, Premium bamboo laser branded straws Thanks in advance for any help/tips! Link to comment Share on other sites More sharing options...
Cassie Posted July 22, 2021 Share Posted July 22, 2021 Without a doubt, the best way to debug is by putting together a minimal demo. We don't just ask for demos because it's easier for us - 99% of the time when you narrow an animation down you'll find the issue. Pop together something on codepen - if you don't figure out the issue along the way - we'll have a look for you. 2 Link to comment Share on other sites More sharing options...
Creativist-Lab Posted July 22, 2021 Author Share Posted July 22, 2021 Hello @Cassie, yes I understand this but I thought because I literally copied some examples to test this which gave the same result it wouldn't bring much insight because on Codepen the examples work normally. So what I did now which is hopefully ok is made a test on the site that I'm working on so this example I copied on my site: https://greensock.com/docs/v3/GSAP/CorePlugins/ModifiersPlugin And here you can see how it behaves on my site: Test I'm sorry for bothering you guys with it but I have been trying to figure out things for a long time but I keep getting the same results that's why I thought maybe better ask here. Thanks again. Link to comment Share on other sites More sharing options...
Creativist-Lab Posted July 22, 2021 Author Share Posted July 22, 2021 Hello @Cassie so your tip kinda worked...... I inspected the elements again and then I noticed that when i am using text it is being wrapped in an extra DIV so I made the exact example in a codeblock on my website and now it behaves as it should. Sorry again to bother you with this but I'm glad I finally figured it out (still with the help of you guys ) 1 Link to comment Share on other sites More sharing options...
Cassie Posted July 22, 2021 Share Posted July 22, 2021 Yeah. I get you! The default emotion is 'This thing works there and doesn't work here so it's broken' But code is logical. Stuff doesn't just break - it's always because we've added some styles, or some layout or something that conflicts. Debugging is 99% narrowing things down until you find the stray div/semicolon. Patience is probably the most useful tool for debugging really! 3 Link to comment Share on other sites More sharing options...
Creativist-Lab Posted July 22, 2021 Author Share Posted July 22, 2021 Yes I definitely encountered what you are saying already more than once but I guess there is always this thing that you can overlook. And probably with everything that you discover you have another option to look out for with a next thing that doesn't work the way it should. Anyway thanks once again for taking the time to answer. 2 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