Webkit overflow scrolling touch CSS bug on iPad

Question

If you visit this page on your iPad device on the latest version of iOS you can follow along.

http://fiddle.jshell.net/will/8VJ58/10/show/light/

I have two e

Answer 1

Coming late with a similar, but simpler solution.

var $el = $('.myElementClass');

function setOverflow(){
    $el.css({webkitOverflowScrolling: 'touch', overflow: 'auto'});
}

function resizeHandler(){
    $el.css({webkitOverflowScrolling: 'auto', overflow: 'hidden'});
    setTimeout(setOverflow,10);
}

[EDIT] Watch out, after experimenting (a lot), I found out that display:none declarations will surely break the webkit-overflow-scrolling: touch feature. Never use it on elements (or parents of elements) that are supposed to support touch scrolling.