Reduce logo and header size on scroll

  • Resolved ssqm20

    (@ssqm20)


    3 years, 10 months ago

    Hello,

    Is it possible to reduce the logo size and header size on scroll?
    Also, the logo does appear centered on different devices. How can I solve that?

    Thank you.

    • This topic was modified 3 years, 10 months ago by ssqm20.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Branko

    (@brankoconjic)

    Hey,

    It seems you are not using the inbuilt sticky header features, so I can’t help with the logo and header size on scroll.

    Basically, you can add a new scroll listener in Javascript and then after some scroll add a CSS class to the header.

    I believe the logo issue might be related with the custom responsive menu you have in the header.

    Can you take a screenshot of the issue?

    Thread Starter ssqm20

    (@ssqm20)

    Hi,
    Thanks a lot for taking a look into this.
    As you said, I do not use the inbuilt sticky header, because when I turn that feature on, it makes the menu sticky rather than the logo bar that needs to be sticky.
    Is there another way to make this happen without the plugin I’m currently using?

    The logo was actually turning up correct until recently, when I had to change the logo to the current one, after that the tablet and mobile versions do not appear correct.

    https://ibb.co/920BDv2

    Here is the screenshot of the homepage from mobile.

    Thank you!

    Branko

    (@brankoconjic)

    Header Layout 1 and Header Layout 2 will sticky the header bar, but the Header Layout 3 will make the Navigation Bar sticky only.

    For example, if you have a large header, making Header Layout 3 sticky would take a lot of space on mobile devices.

    You could try with the other two header layouts in your case.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Reduce logo and header size on scroll’ is closed to new replies.