Jquery DIV显示在屏幕外

我正在使用我在另一个问题上发现的html&jquery，它运行良好，只有一个例外

它显示和隐藏div，效果很好，除非div靠近屏幕底部，否则它会显示出来，但其中一部分在屏幕外

是否仍有更新此代码的方法，以便在DIV部分脱离屏幕时，自动滚动页面，使其进入视图

HTML:

<ul id="list">
    <li>
        <a href="#" class="togglelink">America</a>
        <div class="toggle" style="display: block;">
            <p>America - USA - the States</p>
        </div>
    </li>
    <li>
        <a href="#" class="togglelink">Brazil</a>
        <div class="toggle" style="display: block;">
            <p>Brazil - Federative Republic of Brazil</p>
        </div>
    </li>
</ul>

显然，显示的任何其他div以及未脱离屏幕的div都不应受到影响

---

非常感谢：-D

您可以通过其y值和高度确定div容器的位置。因此，您可以确定它何时离开屏幕。然后，您可能希望使用css添加视差滚动

，您可以根据需要调整div的位置，这样它就不会影响其他div的位置了

，它可能不漂亮，但当然可以工作。Jquery使用普通的Javascript底层。您可以查看以下内容：

$(document).ready(function () {
    $('.toggle').hide();
    $('a.togglelink').on('click', function (e) {
        e.preventDefault();
        var elem = $(this).next('.toggle')
        $('.toggle').not(elem).hide('slow');
        elem.toggle('slow');
    });
});