Header Height Control // Fixed Header + Social Icons + additional Navigation

Hi,

You can assign the initial height, The smaller height is based on a percent of the initial height.

Please open up /js/avia.js and find line 776 that looks like

el_height       = $(elements).filter(':first').height(),

and change it to something like this, but using the height of the header you want (big). Don’t forget the comma at the end,

el_height       = 120,

Thanks,

Nick

Hi,

Do you have a url where this is taking place because I am not seeing this on my local. You can mask the url with http://www.goo.gl

Thanks,

Nick

Hi,

Since I can’t see your code to give you the correct css for your situation, I will guess. Please add this to your /css/custom.css or to Quick CSS located in Enfold > Theme Options – Layout (textarea at the bottom) . If it doesn’t fit change 247px to a lower or higher number.

.fixed_header.social_header #main {

padding-top:197px !important;

}

Switching to mobile navigation at larger screen size will annoy tablet owners. I think a better solution would be to lower the menu , however to change the screen size that triggers the mobile menu please open up /js/avia.js and find line 1099 which looks like

switchWidth: 768,

Change that number above (768) to 790

and also please add this css but change 767 to whatever number you put above minus one. so if instead of 768 you put 777 then put 776 below.

@media only screen and (max-width: 767px){

.responsive .main_menu {

position: static;

}}

Thanks,

Nick