启用溢出隐藏时滚动功能不起作用

Question

我有一个由三个div组成的网站。其中两个div嵌套在主div中。主div的宽度为100％，高度为100vh，溢出隐藏。这将使网站无法滚动，无论如何都会隐藏下面的内容。这正是我想要的。

现在我想绑定一个动作来向下滚动＆＃39;并且＆＃39;向上滚动＆＃39;但似乎，因为在此网页上无法滚动，滚动功能已完全关闭。我该怎么做？ （我确实找到了一个没有回复的帖子，但是这个人建议我不要使用溢出隐藏，我绝对不能这样做。）

HTML

<div id ="main">
<div class="d1"> </div>
<div class="d2"> </div>
</div>

CSS

#main {
width:100%;
height:100vh;
background-color:#999;
overflow:hidden;
}

JQuery的

//Firefox
 $('#elem').bind('DOMMouseScroll', function(e){
 if(e.originalEvent.detail > 0) {
     //scroll down
     alert("Down");
 }else {
     //scroll up
     alert("Up");
 }

 //prevent page fom scrolling
 return false;
 });

 //IE, Opera, Safar are not included to make this thread more clear

我希望你们能帮助我，