Okay
  Public Ticket #1389228
Sticky Header Animation
Closed

Comments

  •  1
    dainiusch started the conversation
    December 1, 2017 at 9:10pm

    Hi - is it possible to disable animations on sticky header, i.e have a main horizontal menu displayed all the time, without animation effects.

    I spent some looking into different settings, however I cannot configure the menu just to stay on top. Current animation gives me undesirable effect (i can see the background slider displayed transparently on top of the menu while scrolling and all i need is my page content to scroll under the menu.

  • [deleted] replied
    December 2, 2017 at 2:38pm

    Hi dainiusch,

    Please before you continue with further steps please consider firs reading the article we wrote about Adding Custom CSS to your site, then paste the code below in Custom CSS Section.

    .main-header.sticky-absolute.sticky-fixed {
    opacity: 1 !important;
    visibility: visible !important;
}

    Thank you.

  •   dainiusch replied privately
  • [deleted] replied
    December 4, 2017 at 2:00pm

    Hi dainiusch,

    Can we try to updated to new one please and see if it get fixed.

    .main-header.sticky-absolute.sticky-fixed {
    opacity: 1 !important;
    visibility: visible !important;
    backface-visibility: initial !important;
}

    Thank you.

  •   dainiusch replied privately
  • [deleted] replied
    December 5, 2017 at 2:54pm

    Hi dainiusch,

    I believe that this is the final  solution, please add the following code in Custom CSS:

    .main-header.sticky-absolute {
    background-color: rgb(255, 255, 255) !important;
}

    Thank you.

  •  1
    dainiusch replied
    December 8, 2017 at 8:35pm

    Hi - this pretty much fixed the problem, there is still approximately 1 pixel movement while scrolling down - I will try to find what is causing this.

  • [deleted] replied
    December 9, 2017 at 6:06am

    Hi dainiushc,

    Please paste the code below in Custom CSS section:

    [edit]

    .main-header.sticky-initialized+.sticky-spacer{ visibility: hidden; }

    [/edit]

    Thank you.