Support » Theme: Karuna » Fixed header bug (Karuna)

  • Jan

    (@janboddez)


    Hi!

    Just wanna report what I believe is a (tiny) bug in the Karuna theme.

    It’s about var stuckHeader = $( '.sticky-wrapper.sticking' ); and var stickyHeaderHeight = stuckHeader.outerHeight(); in functions.js, really.

    On page load, there’s no .sticking class on the .sticky-wrapper div. As such, stickyHeaderHeight ends up being null. (Can be seen writing stickyHeaderHeight to the console.)

    As a result, no padding-top is added to body on scroll, and the page kind of ‘jumps up’. This is noticeable especially when the header image is not set. (Headings — or the page-wide header widget, if in use — will suddenly disappear behind the fixed header on scroll, making them a bit harder to read.)

    A quick fix would be to be to hard-code a (large enough) value (in px or ems) into the JavaScript file.

    Another, and I believe cleaner (or at least less jerky in e.g. Firefox) fix I’ve used (at http://www.farma-service.be/, e.g.), is to assign position: static to the entire header (through an extra wrapper div) and a hard-coded offset to body. (Upon scroll, the .sticky-wrapper div will sit ‘on top’ of the (now hidden) top-bar. No need to hide it or add padding to body. You would still need to know the (almost) exact final sticking header height, though.

    • This topic was modified 11 months, 1 week ago by  Jan.
    • This topic was modified 11 months, 1 week ago by  Jan. Reason: Typos
Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator Kathryn Presner

    (@zoonini)

    Automattic Happiness Engineer

    Hi @janboddez – thanks for the detailed report! I’ve passed it along to our developers so they can have a look and we’ll keep you posted here.

    Theme Author Automattic

    (@automattic)

    Howdy!

    Thanks much for this report! We’ve made a fix to Karuna which should take care of this in the next version of the theme.

    Cheers,
    Caroline

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Fixed header bug (Karuna)’ is closed to new replies.