Hide site title initially, but show when scrolling?

  • Resolved davidtraveler

    (@davidtraveler)


    8 years ago

    Anyone know the CSS to get the header to display site-title ONLY once you’ve started scrolling down?

    Right now, I’m able to hide it either completely or not at all by toggling “.tc-header .brand .site-title”. Can’t make it differentiate between initial header vs. shrunken header, though.

Viewing 1 replies (of 1 total)
  • Thread Starter davidtraveler

    (@davidtraveler)

    Figured it out. You have to add “-scrolled” to the element(s?) and then specify opacity, as such:

    .tc-header .brand .site-title {
    opacity: 0;
    }
    .tc-header-scrolled .brand-scrolled .site-title-scrolled {
    opacity: 1;
    }

Viewing 1 replies (of 1 total)
  • The topic ‘Hide site title initially, but show when scrolling?’ is closed to new replies.