Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Transparent Header in 7.0


Recommended Posts

Site URL: https://www.onekindcreative.com

I have read through quite a few threads and I haven't found an answer on this one. I am wanting a transparent header (something that 7.1 makes pretty easy). I have tried using code but I haven't been able to get the content to move up to the top of the screen (behind the logo and links). I want this on both web and mobile and all pages. I have also attached two design images of what I am trying to accomplish.

Screen Shot 2020-05-18 at 9.44.30 AM.png

Screen Shot 2020-05-18 at 9.44.17 AM.png

Link to comment

Add to Home > Design > Custom CSS

header.Header.Header--top {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
    background: transparent;
}
.Parallax-item:first-child {
    top: 0 !important;
}
/* mobile */
.Mobile.loaded {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
    background: transparent;
}
.Mobile-bar.Mobile-bar--top {
    background: transparent;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...