Есть страница, настолько длинная, что порождает вертикальный скролл.
На ней есть попап id="user_data". Контент в нем настолько больной, что порождает вертикальный скролл

Надо чтобы когда я скроллю контент в попапе сама страница не скроллилась даже когда я проскроллю попап полностью.
Наваял:
function noscrl(event){
if (!event){ event = window.event; }
if(event.preventDefault) event.preventDefault(); else event.returnValue = false;
}
$('#user_data').mouseover(function(e) {
if (document.addEventListener){ document.getElementsByTagName("body")[0].addEventListener('DOMMouseScroll', noscrl, false); }
document.getElementsByTagName("body")[0].onmousewheel = noscrl;
});
$('#user_data').mouseout(function() {
if (document.removeEventListener){ document.getElementsByTagName("body")[0].removeEventListener('DOMMouseScroll', noscrl, false); }
document.getElementsByTagName("body")[0].onmousewheel = '';
});
В результате, когда я пытаюсь поскроллить попап (мыш над попапом) не скроллится ничего. Что не так изобразил?