Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #25504

    I am looking to remove the logo on the small fixed header so when you scroll down the page you only see the menu.

    It would be great if this could turn to a transparent(ish) black and the menu items centered.

    Thanks!

    http://www.eb-crafts.co.uk

    #127201

    Hi,

    Edit js > avia.js, find this code

    //check if the browser supports element rotation
    function avia_header_size()
    {
    var win = $(window),
    header = $('.fixed_header #header'),
    logo = header.find('.logo img'),
    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();
    }

    Replace it with this:

    //check if the browser supports element rotation
    function avia_header_size()
    {
    var win = $(window),
    header = $('.fixed_header #header'),
    logo = header.find('.logo img'),
    logoimg = $('.logo'),
    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;
    logoimg.show();
    //header.removeClass('shadow');
    }
    else
    {
    newH = el_height/2;
    logoimg.hide();
    //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();
    }

    Regards,

    Ismael

    #127202

    That’s great thank you!

    Any way to change the menu to be black with white text? The sort of look I’m after is displayed on this theme: http://hogash-demo.com/kallyas_wp/ (Have to scroll quite a way down..!)

    #127203

    Hi,

    You can try this

    .header_color .header_bg {
    background-color: rgba(0,0,0,.9);
    color: white;
    }

    .header_color .main_menu ul:first-child > li > a {
    color: white;
    }

    .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: gray;
    }

    Regards,

    Ismael

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Remove logo on fixed header’ is closed to new replies.