禁用在画布上滚动，同时仍允许在页面上的任何位置滚动

Question

我有一个位于html页面正文中的画布。如果我不在画布上禁用滚动，那么我最终会得到2个滚动条（1个用于正文，1个用于画布），画布滚动得到＆＃34;卡住＆＃34;几秒钟毋庸置疑，用户体验并不是很好。

所以我使用以下内容禁用了画布中的滚动：

$("my_canvas").bind("wheel mousewheel", function(e) {e.preventDefault()}); 

这很有效，除了滚动页面的唯一方法是将鼠标放在画布区域外的最边缘。下图显示了我的意思：

如何禁用画布上的滚动（以防止2个滚动条）但仍允许主体滚动而不管鼠标位置？