javascript - 如何在溢出 :hidden div 中滚动更大的 div

Question

我有以下结构:

<div id="start">
    <div id="largediv">
        <div id="ball"></div>
    </div>
</div>

例如，div 开始具有固定的高度和宽度，如 500px x 500px而 div largediv 有 1000px x 1000px。我可以在 500x500px 区域移动球，但我不知道如何滚动，所以我可以更改 largediv 中的位置。另一件事是开始 div 隐藏了溢出。这是jsfiddle http://jsfiddle.net/zander_pope/xd4fb1nz/

Answer 1

您可以使用 jQuery mousewheel 功能。

$("#start").on("mousewheel", function(e){    
    var scrollTop = $(this).scrollTop(),
        scrollLeft = $(this).scrollLeft();
    $(this).scrollTop(scrollTop+(e.originalEvent.deltaY));
    $(this).scrollLeft(scrollLeft+(e.originalEvent.deltaX));
    return false;
})

Jsfiddle