Cant get with a jquery function to absolute-pos a div working for iphone

This is the function i use to reposition the #nav div in the middle (vertical) of the window

function RepositionNav(){
            var windowHeight = $window.height(); //get the height of the window
            var navHeight = $('#nav').height() / 2;
            var windowCenter = (windowHeight / 2); 
            var newtop = windowCenter - navHeight;
            $('#nav').css({"top": newtop}); //set the new top position of the navigation list
    }

this is where i reposition while scrolling on the window

$window.bind('scroll', function(){ //when t开发者_开发问答he user is scrolling...

                RepositionNav();
});

It works fine, but not in iphone... I mean, it disappears as users scroll down :? (stays on its original position, top)

Any idea why?

Thanks a lot

Seems silly, but make sure you do + "px" on the .css() assignment for top.

iPhone might handle it's window height differently. I'd output some debugging information so you can verify that the iPhone is reporting/getting the correct values.

edit 5/19/11 9:35am est

In looking at your original question, and the comments you made about the iPhone reporting 240px no matter how much you scroll..it makes sense that it'd report 240px. Your navHeight is a fixed value, and your windowHeight is a fixed value, so you will always get the same newtop value when you subtract them. You need to take into account the scrolling offset of the page - try using the window.scrollYOffset value in conjunction with your equation, like so:

var windowHeight = $window.height(),
    navHeight = $('#nav').height() / 2,
    windowCenter = (windowHeight / 2),
    newTop = (windowCenter - navHeight) + window.scrollYOffset;
    /* we use the scrollYOffset to normalize your newTop value to
       the current top of the viewPort, based on how far the user has
       scrolled down on the page.
    */

$('#nav').css({ top: newTop });