JQuery iphone / android scrolling header fixed?

Question

JQuery iphone / android scrolling header fixed?

In the contacts on iphone and android, when you get to B, the heading “B” is fixed at the top of the scrollable windows, until you scroll down to the heading C, when you get to the heading C, it replaces the heading B, so if a person watches to one of his contacts 200 E, he knows it in section E. Does this make sense? when the title hits the top of the window, it is fixed and remains fixed until the top of the window is scrolled to the next title, in which case the new title replaces it when the title reaches the top of the window, etc.

$(window).scroll(function() {
var title_top = $('h2').top()
var window_top = $(window).top()

    if (title_top <= window_top) {
        $('h2').css({position:'fixed', top:'0'});
    } else {
        $(this).css({position:'static'});
           }   
});

OR

$(window).scroll(function() {


    if ($(window).scrollTop < $('H2').offset().top) {
        alert('yay! awesome.')
    } else {
        $(this).css({position:'static'});
           }   
});