WordPress.org

Ready to get started?Download WordPress

Forums

Terrifico
[resolved] Is It Possible to Lock the Page Header ? (3 posts)

  1. jetman3
    Member
    Posted 6 months ago #

    Went looking on my own solution to one more inquiry: can the Top Panel/Logo be locked in placed, so only page content scrolls ? Found a couple of sites that explain the process and it seems pretty straight-forward. Then I quickly discovered their demo pages wouldn't work on Chrome or whatever. I simply don't know enough XHTML/CSS/WordPress skill (yet !) to mod someone else's code.

    Is this an easy patch or will I have to wait til the next rev of the theme ? Thanx for the use of the brain cells.

    BTW, yesterday's mod took all of five mins to do and worked 1st time !!! <!-- thmubsup -->

  2. vpthemes
    Member
    Theme Author

    Posted 6 months ago #

    You can try to do it this way:

    1. Add this line of code to style.css:

    #branding {
    z-index: 99;
    }

    2. Edit file name custom.js located inside "js" folder in your theme directory and insert this line of code on line #14 :

    $(document).ready(function(){
    $(window).scroll(function(){
    var scrollTop = 85;
    if($(window).scrollTop() >= scrollTop){
    $('#branding').css({
    position : 'fixed',
    top : '20px',
    width: '100%',
    });
    $('#top-panel').css({
    display : 'none'
    });
    }
    if($(window).scrollTop() < scrollTop){
    $('#branding').removeAttr('style');
    $('#top-panel').removeAttr('style');
    }
    })
    });

  3. jetman3
    Member
    Posted 6 months ago #

    Have implemented your patch w/ partial success:

    • The Top Panel isn't included in the fixed header. As soon as scrolling starts, the Top Panel content disappears and body text scrolls thru that region, the Header itself remains locked.
    • Once I disabled the Top Panel, the entire Header is locked and pretty much works the way it was intended. Scrolling down (initially) and scrolling back to the top (just before reaching the top of body text) causes the Header to flicker.
    • Had a black/transparent region above Header, where Top Panel would be once I began scrolling while visiting the site on my Android 2.2 smartphone.

    Tried it using Firefox 24, Chrome 30, and IE 10 under Windows XP + Windows 7. I'm cool w/ the result as is, but hope you decide to support a tweaked version of this feature in the next rev of the theme. Thanx again for the use of the brain cells.... <!-- thumbsup -->

Reply

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.