Hide navigation bar on scroll with animation

Some apps (facebook, 9gag) have this functionality. When the user scrolls up the navigation bar gradually hides itself to a point where it completely vanishes. Then when the user scrolls down the navigationBar gradually shows itself (depending on the speed of the scroll).

We tried to implement this on titanium by adjusting the height on the scroll event, but it is lagged and very slow:

scrollView.addEventListener('scroll',function(e){ 
    if(boolScroll){
        auxScroll=e.y;
        boolScroll=false;
    }
    var bh=bars.height;
    var sh=scrolls.height;
 
    if(auxScroll<e.y)//scrolling down
        if(bars.height>appHeight*0.08){
            bars.height=bh-appHeight*0.005; //rate for hiding
            if(scrolls.height<appHeight*0.78)
                scrolls.height=sh+appHeight*0.005;//same rate to increase the height of the scroll
        }
 
    if(auxScroll>e.y)//scrolling up
        if(bars.height<appHeight*0.16){
            bars.height=bh+appHeight*0.005; 
            if(scrolls.height>appHeight*0.7)
                scrolls.height=sh-appHeight*0.005;  
        }
});
scrollPartidos.addEventListener('touchstart',function(e){ 
    boolScroll=true;
});

There is a solution for iOS on this question. Any help would be appreciated!

Check this gif