-webkit-mobile browser position problem

I am looking for a fix to position:fixed on ipad/iphone, I am currently trying to the following so that my overlay background fills the entire开发者_运维问答 screen.

if(navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod')
    {
         alert("ipad");
         $("#overlay").css({
            "position": "static"
         });
    };

    $("#overlay").css({
        "height": $(window).height()+"px"
    });

The iScroll library would probably really help you. Although, it is more geared toward fixing the overflow:scroll problem, it also should solve this problem. It doesn't update with any DOM change, though. You'll have to code for it to refresh and/or destroy and recreate the iscroll object on any DOM change.

http://cubiq.org/iscroll-4

Also found on that page is this: http://cubiq.org/follow-along-floating-layer

Though I haven't tested it myself, it sounds like it should do what you want.

FYI, based on this blog post, it looks like this issue may also be resolved with the release of iOS 5.