How to disable or enable window's scroll or key events?

When you try to write a simple java script for overlay or popup message, you might find it odd when the background content scrolls when user try to scroll it using mouse or keyboard. So here is a simple java script to disable it....

   // left: 37, up: 38, right: 39, down: 40,
   // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36

   var keys = [37, 38, 39, 40];

   function preventDefault(e) {
     e = e || window.event;
     if (e.preventDefault)
     e.preventDefault();
     e.returnValue = false;  
   }

   function keydown(e) {
       for (var i = keys.length; i--;) {
           if (e.keyCode === keys[i]) {
               preventDefault(e);
               return;
           }
       }
   }

   function wheel(e) {
     preventDefault(e);
   }

   function disable_scroll() {
     if (window.addEventListener) {
         window.addEventListener('DOMMouseScroll', wheel, false);
     }
     window.onmousewheel = document.onmousewheel = wheel;
     document.onkeydown = keydown;
   }

   function enable_scroll() {
       if (window.removeEventListener) {
           window.removeEventListener('DOMMouseScroll', wheel, false);
       }
       window.onmousewheel = document.onmousewheel = document.onkeydown = null;  
   }

Call disable_scroll() from the code above before animation and enable_scroll() after the animation ended.

Read more...