jquery - iOS prevent scrolling with overlay -

I have a wordpress site with such basic homepage structure:

My CSS looks like this:

  div.overlay {background: # 000000; Display area; Width: 100%; Height: 100%; Status: fixed; Top: 0px; Bottom: 0px; Opacity: 0; -Wbkit-Infection: Opacity 15s; -MOZ-Infection: Opacity 1S; -MMS transition: Opacity 1s; -O-Infection: Opacity 1S; Transition: Opacity 1s; Overflow-y: auto; -webkit- overflow-scrolling: touch; } Div.overlay.active {z-index: 10000; Opacity: 0.4; }  

And I toggle my active class with simple jQuery.

My problem is that when the overlay is active , I can still scroll to # scrolling-body but only on iOS mobile devices. I prevent scrolling on other devices like this ( scroll is calculated when active is toggled):

  $ (Window) .scroll (function (e) {e.preventDefault (); $ (document) .scrollTop (scroll);});  

I have tried those touchstart solutions that are written on SO (no longer find links). They do not work, what else do I need to do?