Home Forums Weaver X Tutorials and Hints Animated Transitions Menu Fixed on Scroll

This topic contains 5 replies, has 2 voices, and was last updated by  dnadesign 5 months, 3 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #59295

    dnadesign
    Participant

    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/

     

     

    #59313

    scrambler
    Moderator

    Try using the size in em like

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

    #59330

    dnadesign
    Participant

    Worked perfectly – Thanks Scrambler 🙂

    #59333

    dnadesign
    Participant

    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?

    #59339

    scrambler
    Moderator

    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;}

     

    #59342

    dnadesign
    Participant

    Awesome – You are Brilliant!!

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.