Question

我有一个绝对定位的div，它充当页面中心的模态窗口。模态窗口可垂直滚动，右侧有滚动条。页面本身也可以垂直滚动，右侧有一个滚动条。我希望能够点击链接并让模态窗口滚动到链接项目。

我可以使用target.scrollIntoView（）;但整个页面与模态窗口一起滚动 - 我希望它能使页面不移动，只有模态窗口滚动。如果我使用scrollIntoView（false），页面本身不会滚动，而模态窗口会滚动，但目标元素位于窗口的底部，而我喜欢它在顶部。

有什么方法可以手动抵消div中目标的位置？即如果我使用scrollIntoView（false），目标显示在div的底部 - 如果我可以将它偏移到视图窗口的高度我应该能够将它移动到顶部..？

注意：我不能使用JQuery等。

提前感谢您的帮助。

Answer 1

这是一个现场演示，我认为你正在寻找的是：http://jsfiddle.net/QN3mK/

执行此操作的代码是:(主要检查scrollFunc()函数）

function scrollFunc() {
    var est = document.getElementById('est');
    var docPos = f_scrollTop();
    est.scrollIntoView();
    window.scrollTo(0,docPos);
}

function f_scrollTop() {
    return f_filterResults (
        window.pageYOffset ? window.pageYOffset : 0,
        document.documentElement ? document.documentElement.scrollTop : 0,
        document.body ? document.body.scrollTop : 0
    );
}

function f_filterResults(n_win, n_docel, n_body) {
    var n_result = n_win ? n_win : 0;
    if (n_docel && (!n_result || (n_result > n_docel)))
        n_result = n_docel;
    return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
}

后两个函数只是一种跨浏览器兼容的方式，我发现获取页面的当前滚动位置。所以这样做是找到一个元素（可能在一个可滚动的div中），获取页面的当前滚动位置，将元素滚动到视图中（将它放在可滚动div的顶部）然后重置页面位置它到底在哪里。可能不是一个理想的解决方案，但它可以完成工作。

Answer 2

您可以尝试将整数值分配给scrollTop属性。

滚动到div中的元素

2 个答案: