video1.0<iframe src="https://www.loom.com/embed/78d6a4ea3a6d435a9e03893d70584f9c" frameborder="0" width="2034" height="1525" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>15252034Loomhttps://www.loom.com15252034https://cdn.loom.com/sessions/thumbnails/78d6a4ea3a6d435a9e03893d70584f9c-609268fdf22dabe5.gif451.33This Loom explains how to animate a navbar background and shadow on scroll using GSAP, focusing on a client example. The speaker wraps the navbar component in a div so CSS and page-specific classes can control the nav separately, and sets up an interaction where the navbar background transitions from a transparent opacity 0 state to a “denim dark” color while the shadow fades in from opacity zero to 100 percent. They note it uses a page trigger that must be manually applied to each page, though the newer GSAP interactions panel could enable site-wide triggers. A second, similar project uses a blurred gradient shadow that moves slightly and fades in only when scrolling down, with subtler effects that are most noticeable on the homepage.