iOS 6: Safari overflow: hidden on containing div not working when modal open

Question

I can't seem to use overflow: hidden trick on the body of my website in order to lock the background content when a modal is open.

I'm applying the current styles onto the body:

    $('body').css({'overflow':'auto', 'position':'static'});

And they are being successfully applied, it works fine in Android, the background content locks, however in iOS devices, this doesn't work and the content background content is still scrollable. Any idea what would cause this?

This is the meta viewport tag I am using:

<meta name="viewport" content="width=device-width, maximum-scale=1">

Answer 1

iOS6 Webview requires overflow hidden on both the html and body element to work correctly. If someone wants to add it to the webkit bug tracker I'd be much obliged :).

Either this or the question here should be marked as duplicate.