The Old Designer

I thought that's what I did with just CSS as well? If the footer is fixed to the bottom and higher than 100vh (as I think you ,mentioned above) surely you are going to have a problem with the content at the top of the footer being hidden?

You don't actually need GSAP unless you want to animate it, its simple CSS Create a div container for the content and give it a bottom margin of (for example) 230px; then below that add the footer with position of fixed, left: 0, width:100% and a z-index of -10. You can then animate the content div to for example scale downwards a little as it reached the end of the page to create a nice effect

Not sure why the image needs to be position:absolute? Why not just set the image as a background to the .container then use the CSS declaration 'aspect-ratio: ' to keep the image a constant size and then just animate the container?

Not sure if this helps, I too only use FTP. I bundle the JS files locally using ESM so it compiles into 1 minified JS file which I then upload. I tend to do this through Codekit as it saves me a lot of fiddling about.

Cassie has a good explanation here..

Hi Cassie thanks for the response, sorry if I was unclear. The example I was thinking of, basically the same as the gallery example above but each image (maybe 20-30) animating to a state where there are more related images, and formatted text, pretty much like an agency portfolio/case study idea. Yes using Flip as I understand view transitions are a way off, have no desire to use SPA's or a library like Baba unless I have to, and anyway I prefer GreenSock ?

Hi, Just a question on using Flip for this, I have user cases where this could be really useful but... What's the effect on page load/size if you need to add quite a bi of "stuff" to the flipped to state? I am thinking of a couple of images, divs and texts for each element targeted as per the example above. Is this an intended/viable use or are page transitions or even the new view transitions testing in Google Canary / single page applications a better bet? Obviously I would love to use Flip but wondered if you had a clarification or advice please

I think it's important to know how you define "beginner" you are going to need reasonable HTML and CSS skills to create anything you may want to use commercially, plus you are going to have to have a basic (and I mean very basic) understanding of Javascript conventions. I would consider myself pretty bad at the javascript side, I can work out what's happening and even write a little bit, and thanks to lurking here I have incorporated some GSAP into some sites with client feedback that seems to assume I am some sort of genius. ? My advice is to dive in and mess it up as I have done many times, this forum is one of the friendliest tech forums around (and a rarity for it) so help is always at hand.

Not going to be specific because my coding skills leave a lot to be desired by you only need to define the animation once. This may server as a good starting point.. and part of an excellent course I would thoroughly recommend BTW. Coden Snorkel TV

Quick thought (not gasp related) but I would probably look at a 3 divs each containing both the relevent sidebar and the panel. You can then play with positioning, either stacking them on top of each other on the left or side by side. Probably easier to animate that way.

You can also look into CSS filters https://www.w3schools.com/cssref/css3_pr_filter.php Trust me we all start somewhere and when I see some of the code solutions here seemingly just added off the top of the head I despair I will ever get that good.. still keep trying, I do!

You can also try this CSS "solution" body { min-height: 100vh; /* mobile viewport bug fix */ min-height: -webkit-fill-available; }

You can do a fair bit to the scrollbar with CSS as well https://css-tricks.com/the-current-state-of-styling-scrollbars-in-css/ Whoops sorry just noticed someone beat me to it..

One answer would be not to use GSAP or JS in general given your circumstances. Yes I know it's a GSAP forum but why are you knocking yourself out attempting to offer something you can not really do? No shame in that, I am far from a JS expert, not bad at CSS and HTML but would not consider myself a guru at anything. Sell yourself and sell to your strengths, it far easier and far more rewarding. I also work with clients with limited budgets or who have some hanger on willing to make things for nothing. That's fine, the clients that take that advice are not for you, competing with an omnipresent relative picking away all the time is always going to be a loosing proposition. If your strengths are marketing then sell the marketing benefits of having the website and just learn or use something like Wordpress with its myriad of themes and plugins to suit most situations. (Disclaimer I do not like WP, rarely use it but do understand why people do). I am really not sure from what you said why you are knocking yourself out trying to fit a square peg (you) into a round hole (js based animation) as you said yourself you really have very little interest in it. This is not meant as a criticism, we probably skill wise have a fair bit in common, the main difference is I can understand the GSAP basics and most importantly enjoy working with it even with my limited skills.

As someone with very limited JS skills I would thoroughly recommend Carl's course above. I had used animation in Flash before so had some idea of when to use it (sparingly). I guess I am lucky in that my clients tend to trust me to do the "right" thing. I usually just use previous work as an example of what can be done but a lot IMO comes down to the client believing in you and your ability to get it right for them. Never add things just to prove how clever you are, add things that bring real value to the client, tangible or otherwise and be prepared to explain why which is often more powerful than the details of what.