Reduce logo and navbar size on scroll

I would like to reduce the overall size of the navbar and logo when the user starts scrolling on the site, and return the logo to full size when they scroll back to the top. My site: https://imbali.storiesandscience.co.za

This is what I’d like to achieve, in more detail:
On scroll down:

  • reduce logo size to width: 65px;
  • reduce overall nav bar height to 100px;
  • move menu items up to fit into narrower nav bar;
  • move WooCommerce cart button to fit into narrower nav bar;
  • ease all changes in over 1 second.

On scroll to top:

  • restore all to default values;
  • ease all changes in over 0.5 second.

I hope you can help!

Hi There,

Thanks for writing in! Regretfully this isn’t a feature offered by X, PRO does. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities. We do have an in-house custom development team that offer paid services, who may be able to assist. They can be contacted at [email protected] if this is of interest to you.

Thank you for understanding.