-
AuthorPosts
-
December 14, 2016 at 6:50 am #724127
I would like to minimise header and hide logo when scrolling
December 15, 2016 at 5:11 am #724723Hey davidnorrie,
Could you post a link to the site in question so that we can take a closer look please? If you have a mockup or screenshot highlighting the changes you would like to make it would help as well.
Best regards,
RikardDecember 16, 2016 at 1:09 am #725115I have almost got it to work see http://www.alpha1builders.co.nz/
This is the CSS added
.header-scrolled .logo img, .header-scrolled .logo, .header-scrolled .phone-info, .header-scrolled .header_bg
{
display: none !important;
height: 0px !important;
line-height: 0px !important;
max-height: 0px !important;
}
.header-scrolled .container_wrap
{
position: relative;
top: -60px;
}
.header-scrolled .av-main-nav-wrap
{
position: relative;
top: 0px;
}The only problem now seems to be the lower white menu border?
Regards
Dave
December 18, 2016 at 9:19 pm #725902Hi Rikard
I have updated the CSS on http://www.alpha1builders.co.nz/ as below and it seems to work well, can you please check the code is OK?
.header-scrolled .logo img, .header-scrolled .logo, .header-scrolled .phone-info, .header-scrolled .header_bg
{
display: none !important;
}
.header-scrolled .container_wrap
{
position: relative;
top: -61px;
}
.header-scrolled .av-main-nav-wrap
{
position: relative;
top: 0px;
}
.header-scrolled .container_wrap_logo
{
border-style: none !important;
border-width: 0px !important;
}Thanks
Regards
David Norrie
December 19, 2016 at 11:08 pm #726320Hi,
I think your code is good and working fine, I think it just needs enhancement when scrolling down, the transition isn’t smooth, you can use some css transitions ( http://www.w3schools.com/css/css3_transitions.asp ) then maybe not use display: none, instead you can use height:0, opacity:0, visibility:hidden, try to tweak it a bit and it should be better :)
Best regards,
Nikko -
AuthorPosts
- You must be logged in to reply to this topic.
