Okay
  Public Ticket #267947
How to hide Header Starting Navigation in transparent mode?
Closed

Comments

  • Nigel started the conversation

    Hi, how do I hide the main Header Starting Navigation altogether when the site loads?  The navigation is interfering with the starting image.

  •  8,839
    Tahir replied

    Hey Nigel!

    I am afraid it cant be hidden on page load though you can try turning on Ajax page transitions in version 4.5.2 . 

    Thanks


    ThemeNectar Support Team 

  • Stella replied

    I was able to use this code to make the header starting navigation hidden and checked "Use Transparent Header When Applicable?" in the Salient settings.

    Don't know if it's the best way to do it, but it worked for me! Essentially, I added: "visibility: hidden;" to all the CSS properties for body#header-outer[data-transparent-header="true"] except for the part I put inside a comment below, which for whatever reason messed up the theme.

    @media only screen and (min-width: 1001px) {
    	
    	body #header-outer[data-transparent-header="true"], body #header-outer[data-transparent-header="true"] .cart-menu {
    		transition: background-color 0.40s ease, box-shadow 0.40s ease;	
    		-moz-transition: background-color 0.40s ease, box-shadow 0.40s ease;
    		-webkit-transition: background-color 0.40s ease, box-shadow 0.40s ease;
    	}
    
    	/* Do not use visibility:hidden here */
    
    	body #header-outer[data-transparent-header="true"].transparent, body #header-outer[data-transparent-header="true"].transparent .cart-menu,
    	.ascend #header-outer.transparent[data-transparent-header="true"][data-full-width="true"] header#top nav ul #search-btn a {
    		transition: border-color 0.40s ease;	
    		-moz-transition: border-color 0.40s ease;
    		-webkit-transition: border-color 0.40s ease;
    	}
    	
    	/* End do not use visibility:hidden */
    	
    
    	body #header-outer[data-transparent-header="true"].transparent .cart-menu {
    		background-color: transparent;
    		border-left: 1px solid rgba(255,255,255,0.25);
    		visibility: hidden;
    	}
    	
    	body:not(.ascend) #boxed #header-outer[data-transparent-header="true"].transparent .cart-menu {
    		border: none!important;
    	}
    	
    	body #header-outer[data-transparent-header="true"] .cart-outer .cart-notification, body #header-outer[data-transparent-header="true"] .cart-outer .widget_shopping_cart {
    		margin-top: 1px;
    	}
    	
    	body #header-outer[data-transparent-header="true"].transparent {
    		background-color: transparent!important;
    		visibility: hidden;
    		box-shadow: none!important;
    		-webkit-box-shadow: none;
    		-moz-box-shadow: none;
    		-o-box-shadow: none;
    		border-bottom: 1px solid rgba(255,255,255,0.25)!important;
    	}
    	
    	#boxed #header-outer[data-transparent-header="true"].transparent {
    		border-bottom: 1px solid rgba(255,255,255,0.25)!important;
    		visibility: hidden;
    	}
    	
    	body #header-outer[data-transparent-header="true"].transparent nav > ul > li > a { margin-bottom: -1px; visibility: hidden;}
    	
    	
    	body #header-outer[data-transparent-header="true"] header#top nav ul #search-btn > div {
    		border-left: 1px solid rgba(0,0,0,0.1); visibility: hidden;
    	}
    	
    	body #header-outer[data-transparent-header="true"].transparent header#top nav ul #search-btn > div { visibility: hidden;
    		border-left: 1px solid rgba(255,255,255,0.25);
    	}
    	
    	body #header-outer[data-transparent-header="true"] .ns-loading-cover {
    		background-color: #393939;
    		position: absolute;
    		width: 100%;
    		height: 100%;
    		top: 0;
    		left: 0;
    		display: none;
    	}
    	
    	#header-outer[data-transparent-header="true"].transparent #logo img, #header-outer[data-transparent-header="true"] #logo .starting-logo {
    		opacity: 0;
    		-ms-filter: 'alpha(opacity=0)';
    		visibility: hidden;
    	}
    	
    	#header-outer[data-transparent-header="true"].transparent #logo .starting-logo {
    		opacity: 1;
    		-ms-filter: 'alpha(opacity=100)';
    		visibility: hidden;
    	}
    	
    	
    }