更改隐藏 div 的滚动答案

【问题标题】：Change the scroll of an hidden div更改隐藏 div 的滚动
【发布时间】：2010-06-23 10:36:55
【问题描述】：

我有一个具有固定高度和滚动条的隐藏 div。我想更改滚动位置，但浏览器不会让我这样做，因为 div 是隐藏的。 scrollTop 属性将保持为 0。

另外，我不想显示和隐藏 div，这会导致闪烁。

如果有人知道怎么做，那将非常有帮助。

谢谢！

【问题讨论】：

取消隐藏时不能改变滚动位置吗？

标签： javascript jquery scroll hidden

【解决方案1】：

您可以使用 jQuery 的数据函数保存滚动。

function SaveScroll(val)
{
    $(the_element).data("Scroll", val);
}

function Show()
{
    var element = $(the_element);

    // prevent from showing while scrolling
    element.css
    ({
        position: "absolute",
        top: "-50000px",
        left: "-50000px",
        display: ""
    });

    // Scroll to the position set when it was hidden
    element.scrollTop(element.data("Scroll"));

    // show the element
    element.css
    ({
        position: "",
        top: "",
        left: ""
    });
}

这可能会解决问题

您也许可以只使用visibility: hidden 而不是display: none。可见性使元素保持在原处。我相信它与opacity: 0 完全一样，但它是一个跨浏览器的解决方案。

【讨论】：

【解决方案2】：

为了防止 div 闪烁并修复脚本的 <div> 不可用，您可以使用位置隐藏而不是 "display: none;"：

.hidden {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
}

【讨论】：

【解决方案3】：

我的问题不完整。 div 不是自己隐藏的。它是隐藏的容器 div 的一部分。内部 div 与他的父级一起显示。

<div class="container hidden">
    <div id="some_div">Content</div>
    <div id="my_div">I wanted to scroll this one</div>
    <div id="other_div">Content</div>
</div>

我们使用 jQuery 想出了一个自定义的“onShow”事件。

所以现在我们可以这样做了：

$('#my_div').bind('show', function() {
    handle_scrollTopOffset();
});

当 show 事件被绑定时，它会将 .onShow 类添加到 div 中。并且 jQuery.fn.show() 函数已被覆盖以触发具有 .onShow 类的子级的“显示”事件。

感谢大家的建议。很抱歉，我提供了一个不完整的问题。下次我会提供所有细节。

【讨论】：

这是我找到的最佳解决方案。而不是一个事件，我只是将 scrollTop() 函数从我的关闭函数移动到我的打开函数。