在没有移动页面的情况下在div中滚动

Question

我有一个<div id="innerContent">带overflow-y:scroll;.innerContent中锚点的链接位于父页面上,而不是在父页面上div.

到目前为止,我已尝试使用anchors和scrollto来尝试在内容中滚动.它们都完成滚动,但innerContent的高度大于浏览器窗口,因此当单击链接时,整个父页面也会滚动到锚点.

有没有办法用javascript执行此操作,而无需移动父页面？我无法控制div的高度 - 这是别人的设计.

这很接近......但这里没有答案. 如何在不滚动整个页面的情况下自动滚动内联div？

谢谢!

Answer 1

这个jsfiddle适用于我.未在其他浏览器中测试过.

捕获鼠标滚轮事件,使用事件数据手动滚动,然后取消原始事件.对于生产来说似乎有点混乱.

$('#scroll').bind('mousewheel', function(e){

    $(this).scrollTop($(this).scrollTop()-e.originalEvent.wheelDeltaY);

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

Answer 2

使用固定布局。在这个 jsfiddle中我有一个工作示例。研究CSS。你不需要 JavaScript。