cr33ksid3

Zach: Thanks again. I will continue to work with the SVG as I started but will look into the suggestions you've made. Plus, I have found the Getting Started and GreenSock 101 courses. I have been reading them at the same time as trying to work on this not-so-quick-to-me project. Interesting to see what GSAP3 evolves into... will continue learning more about current GSAP though.

Zach: Thank you. I was so wrapped up in trying to get this done through just the SVG code and TweenMax. I understand DIVs and CSS better right now. Can this (my) example be fixed to work though? I'm new to working with SVG files too if you couldn't tell. I can create them easy enough using Illustrator but I've never tried to animate them or manipulate them using GSAP... Also, any fantastic online courses out there that you know of that would train a newbie like me at understanding and using CSS and GSAP scripts? I know GSAP has clubs and I found a few tutorials or courses but which is the best and fastest way to get a good grip? Much appreciated feedback too...

Okay, I'm impatient and new to GSAP. Oh, and I hate CSS. I found an example of a vertical banner that works wonderfully. Rather than copy it completely I tried to put my own together and backwards engineer it horizontally. I slapped this design together just to get going with the code. It isn't special. What I am trying to achieve is probably obvious. When you rollover the red half... a full red banner should appear. When you rollover the blue side, the full blue banner appears. It somewhat works but is not very smooth and there are some quirks I have not been able to figure out. You will see what I mean... but if you don't... Rollover the red side and sometimes you see the full blue banner behind it for a split second. Same for the red banner. I've tried almost everything I can think of to hide and reveal things in the right order but something is off. I hate CSS but use it all the time with success (it just takes me longer than others) and I think my problem may be related. Help a newbie to GSAP and CodePen out if you can/would please. How can I fix this to be smooth and work properly. If we fix this, I will design a nicer banner ad to replace it and use the concepts for another CodePen example. Thanks in advance...