Heya,
Can’t share the url of the site I’m working on, but imagine a fresh install with no plugins…
Would it be possible to select a fixed header (with Social Icons, etc) , and as you start to scroll, the logo (instead of shrinking, or at some point while shrinking) disappears?
Optionally the sub nav menu/social icons – could that be triggered to disappear at that point as well? Perhaps when the menu section reaches its smallest size?
The idea is that while it is good to have the menu still visible as you scroll down the page, having the logo and possibly the sub nav present is not desired.
What would I need to modify to make that happen?
Hi,
Unfortunately, this is a bit complicated. Please hire a freelance developer to add this customization on the theme. You can edit the fixed header behavior on js > avia.js.
//check if the browser supports element rotation
function avia_header_size()
{
var win = $(window),
header = $('.fixed_header #header'),
elements = $('#header_main .container, .main_menu ul:first-child > li > a:not(.avia_mega_div a)'),
el_height = $(elements).filter(':first').height(),
isMobile = 'ontouchstart' in document.documentElement,
scroll_top = $('#scroll-top-link'),
set_height = function()
{
var st = win.scrollTop(), newH = 0;
if(st < el_height/2)
{
newH = el_height - st;
//header.removeClass('shadow');
}
else
{
newH = el_height/2;
//header.addClass('shadow');
}
elements.css({height: newH + 'px', lineHeight: newH + 'px'});
}
if(!header.length) return false;
if(isMobile)
{
return false;
}
win.scroll(set_height);
set_height();
}
Thanks,
Ismael
Fairdos. Thanks for the info!