javascript - prevent scrolling in browser and device -


i had jquery prevent scrolling in both browsers , on hand held devices:

    $(document).ready(function() {         $('div.overlay').click(function() {             $('html').css('overflow', 'hidden');             $('body').bind('touchmove', function(e) {                 e.preventdefault()             });         });         $('.overlay-close').click(function() {             $('html').css('overflow', 'scroll');             $('body').unbind('touchmove');         });     }); 

but have updated javascript , snipp doesn't work...

this javascript

(function() {   var triggerbuttons = document.getelementsbyclassname('trigger-overlay'),     overlay = document.queryselectorall('div.overlay');   var closebuttons = [];   (var = 0; < overlay.length; i++) {     var closebttn = overlay[i].queryselector('button.overlay-close');     closebuttons.push(closebttn);   }    transendeventnames = {       'webkittransition': 'webkittransitionend',       'moztransition': 'transitionend',       'otransition': 'otransitionend',       'mstransition': 'mstransitionend',       'transition': 'transitionend'     },     transendeventname = transendeventnames[modernizr.prefixed('transition')],     support = {       transitions: modernizr.csstransitions     };    function toggleoverlay(overlay) {     if (classie.has(overlay, 'open')) {       classie.remove(overlay, 'open');       classie.add(overlay, 'close');       var onendtransitionfn = function(ev) {         if (support.transitions) {           if (ev.propertyname !== 'visibility') return;           this.removeeventlistener(transendeventname, onendtransitionfn);         }         classie.remove(overlay, 'close');       };       if (support.transitions) {         overlay.addeventlistener(transendeventname, onendtransitionfn);       } else {         onendtransitionfn();       }     } else {       classie.add(overlay, 'open');       classie.remove(overlay, 'close');     }   }     (var = 0; < triggerbuttons.length; i++) {     triggerbuttons[i].addeventlistener('click', (function(i) {       return function() {         toggleoverlay(overlay[i])       };     })(i));   }    (var = 0; < closebuttons.length; i++) {     closebuttons[i].addeventlistener('click', (function(i) {       return function() {         toggleoverlay(overlay[i])       };     })(i));   } })(); 

it seems no scrolling code kicks in when click (randomly) in popped overlay, , not enabled when press closebttn.

expected result:

scrolling disabled when overlay showed (when triggerbutten pressed). scrolling enabled when overlay closed.


Comments