IE7在滚动之前不会加载可滚动div中的内容

Question

TL；DR：如何强制IE7加载所有被可滚动div隐藏的元素

我正在构建一个"可折叠"菜单来浏览一组页面。这个菜单有两种状态：内爆和爆炸
菜单项就像书中的章节，当用户浏览内容时，"活动"菜单项会下移
页面加载时，我希望项目所在的<div>立即向下滚动（！）到活动菜单项，减去一些偏移量。

和往常一样，这在chrome和ff上运行得很好，但在ie7上则不然。

在分解状态下，当项目在页面加载中不可见时，ie7似乎不需要"加载"项目。现在的情况是ie7启动菜单div时没有滚动条（或者一个非常小的滚动条）。当我将scrollTop设置为所需数量时。div只是向下滚动，直到滚动条"碰到"div的底部"，然后ie7开始加载下一个内容，我可以进一步滚动，直到找到另一个"底部"，等等。

我通过使用一个1000毫秒长的动画（只是选择了一个数字）来解决这个问题。它不符合指定的要求（看起来很难看），我想知道如何在请求之前强制ie7加载此内容，因为它似乎没有加载它。

IE7用户是我们最大的目标群体，因此不能跳过这一点。让用户在没有javascript的情况下使用它是一个巨大的优势。

在内爆状态下没有问题，我尝试在爆炸状态中使用内爆状态CSS的一部分，后来将它们设置为正确的值，但没有帮助。

这里有一些代码：

scrollToCurrent = function(length){
    var prev = $("div.scroller div.selected").prev();
    // Check if previous exists
    if($(prev).length > 0) {
        // number of previous items * height of an item - half an items height
        var scrollY = ($(prev).prevAll().length * $(prev).outerHeight()) - ($(prev).outerHeight() / 2);
        if(length === 0) {
            $("div.scroller").scrollTop(scrollY);
        } else {
            $(".scroller").animate({
                scrollTop : scrollY
            }, length);
        }
    }
};

如果你还需要，请告诉我。

编辑：基本jsfiddle：http://jsfiddle.net/AmazingDreams/keeUY/http://jsfiddle.net/AmazingDreams/keeUY/embedded/result/

Answer 1

更新

最终的解决方案被证明非常简单。由于似乎什么都不起作用，修复一种情况会破坏另一种情况（所选项目最初是否可见存在重大差异），我决定将sh*t从滚动条中删除：

我删除了所有旧的"修复"

scrollToCurrent = function(length){
        var prev = $("div.scroller div.selected").prev();
        // Check if previous exists
        if($(prev).length > 0) {
            // number of previous items * height of item - half an items height
            var scrollY = ($(prev).prevAll().length * $(prev).outerHeight()) - ($(prev).outerHeight() / 2);
            if(length === 0) {
                var i = 0;
                var maxpushes = 100;
                // Push just as long as needed to get the scrollbar to where we want it to (fixes ie7 issue)
                while($("div.scroller").scrollTop() < scrollY) {
                    $("div.scroller").scrollTop(scrollY);
                    // Make sure it can never turn into an endless loop
                    i++;
                    if( i > maxpushes) {
                        break;
                    }
                }
            } else {
                $(".scroller").animate({
                    scrollTop : scrollY
                }, length);
            }
        }
    };

旧的非工作尝试

我设法"修复"了它，把它作为一个额外的项目：更新了下面的修复

    <div class="cycle inactive">
        <?php // I fix IE7 issues ?>
    </div>

我认为<div>中的换行符完成了99%的工作。所以，保持这条线在那里。

我不认为这是"解决方案"，我将保留这个问题，首先我希望这个东西稳定一段时间。

编辑：

好吧，这个"重大更新"只是扭转了问题（即内爆停止工作，爆炸工作）。更新的修复程序：

<?php // Only show if menu starts exploded ?>
<?php if( ! $imploded): ?>
    <div class="cycle inactive">
        <?php // I fix IE7 issues ?>
    </div>
<?php endif; ?>