Site Logo Transition

We have two site wide logo.png’s located in /pages/images… The images are identical, using the antimatter.js to call the logo’s depending whether the nav bar is scrolled or not. With this method the transition is very abrupt. Within Antimatter is there a method by which we can use a single logo.png and use Grav’s abilities to automatically resize this logo on scroll?

Sorry, the images are identical other than the size!

This is nothing to do with Grav actually. it’s simply a CSS transition based on a class that is being added by JS.

You can’t do a CSS transition between two images however, this is just not possible with CSS. You can fake it but it will never be super smooth.