Is It Possible to Lock the Page Header ?

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’);
}
})
});

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 –>