Transition on top menu

Sorry, I should have added that I attached the transition to .toppanel

Thanks,

Spen

Hi Spen,

The default animation effect is created using jQuery and it would therefore be extremely tricky to override with only CSS.

Instead, I recommend creating a child theme and copying the parent theme’s /js/ryu.js file to your child theme’s directory.

This will require some familiarity with JavaScript and jQuery. I recommend the following StackExchange post for guidance on using a JavaScript file in your child theme:

https://wordpress.stackexchange.com/questions/26822/how-to-override-javascript-files-in-child-theme

In /js/ryu.js, you’ll find the following code which defines the panel’s animation effect:

function scrollTop() {
			$( 'body,html' ).animate( {
				scrollTop: 0
			}, 400 );
		};

You can customise this to use jQuery’s sliding effect:

https://api.jquery.com/category/effects/sliding/

Let me know how you get on with that or if you have any extra questions.