jquery - iOS prevent scrolling with overlay -
i have wordpress site basic homepage structure this:
<html> <head></head> <body> <div id="overlay"></div> <div id="scrolling-body"> //lots of stuff here </div> </body> </html>
my css looks this:
div.overlay { background:#000000; display:block; width:100%; height:100%; position:fixed; top:0px; bottom:0px; opacity:0; -webkit-transition: opacity 15s; -moz-transition: opacity 1s; -ms-transition: opacity 1s; -o-transition: opacity 1s; transition: opacity 1s; overflow-y:auto; -webkit-overflow-scrolling:touch; } div.overlay.active { z-index: 10000; opacity:0.4; }
and toggle active
class simple jquery.
my issue when overlay active
, can still scroll #scrolling-body
on ios mobile devices. prevent scrolling on other devices (scroll
calculated when active
toggled):
$(window).scroll(function(e) { e.preventdefault(); $(document).scrolltop(scroll); });
i have tried touchstart solutions mentioned here on (cant find links now). don't work. else need do?
Comments
Post a Comment