Animated Transitions Menu Fixed on Scroll

[dnadesign]

Hi I am trying to implement the Resize Custom Logo effect in the menu when fixed on scroll.

I have added the custom css <code class=”css plain”>#nav-primary .wvrx-fixonscroll .custom-logo-on-menu img {<code class=”css keyword”>height<code class=”css plain”>:<code class=”css value”>50%<code class=”css plain”>;} As from your user guide, but the only effect it seems to have is to make the logo slightly bigger on scroll could you possibly let me know if I am doing something stupid.

http://cd1.dnaonline.co.za/

 

 

[scrambler]

Try using the size in em like

#nav-primary .wvrx-fixonscroll .custom-logo-on-menu img {height:2em;}

[dnadesign]

Worked perfectly – Thanks Scrambler 🙂

[dnadesign]

I know it’s a long shot but have you ever had the whole wvrx-default-menu wvrx-menu-container also change to a smaller height on fixed on scroll?

[scrambler]

Not a long shot at all 🙂

You have increased the height of your menu bar by adding the CSS rule below

.is-desktop #nav-primary ul.wvrx-menu {margin-top:40px !important;}

So you can easily remove that when fixed by adding the rule below

.is-desktop #nav-primary .wvrx-fixonscroll ul.wvrx-menu {margin-top:0px !important;}

 

[dnadesign]

Awesome – You are Brilliant!!

[Author]

Posts