gistfile1.txt

////////JAVASCRIPT////////////////////////

var scrollTimerSet = false;
var navBarIsSmall = false;
var $navBarInner = document.getElementById('header').getElementsByClassName('navbar')[0].getElementsByClassName('navbar-inner');

function getScrollTop(){
    if(typeof pageYOffset!= 'undefined'){
        //most browsers except IE before #9
        return pageYOffset;
    }
    else{
        var B= document.body; //IE 'quirks'
        var D= document.documentElement; //IE with doctype
        D= (D.clientHeight)? D: B;
        return D.scrollTop;
    }
}

function scrollFunction() {
    if (scrollTimerSet) {return;}
    scrollTimerSet = true;
    setTimeout(function () {
        var scrollTop = getScrollTop();
        if (scrollTop !== 0 && !navBarIsSmall) {
            $navBarInner.className += ' small';
            navBarIsSmall = true;
        } else if (scrollTop === 0 && navBarIsSmall) {
            $navBarInner.className = $navBarInner.className.replace(/\bsmall\b/,'')
            navBarIsSmall = false;
        }
        scrollTimerSet = false;
    }, 250);
}

window.onscroll = scrollFunction;

///////CSS CODE ////////

.navbar-inner {
  -webkit-transition: padding .15s linear;
  -moz-transition: padding .15s linear;
  -o-transition: padding .15s linear;
  transition: padding .15s linear;
}
.navbar-inner .brand {
  -webkit-transition: all .15s linear;
  -moz-transition: all .15s linear;
  -o-transition: all .15s linear;
  transition: all .15s linear;
}
.navbar-inner .nav > li > a {
  -webkit-transition: padding .15s linear;
  -moz-transition: padding .15s linear;
  -o-transition: padding .15s linear;
  transition: padding .15s linear;
}
.navbar-inner .top-account-control {
  -webkit-transition: padding .15s linear;
  -moz-transition: padding .15s linear;
  -o-transition: padding .15s linear;
  transition: padding .15s linear;
}
.navbar-inner.small {
  padding: 5px 15px 0;
}
.navbar-inner.small .brand {
  font-size: 18px;
  line-height: 35px;
}
.navbar-inner.small .nav > li > a {
  padding: 5px 10px 5px;
}
.navbar-inner.small .top-account-control {
  padding-top: 5px;
}