Javascript 具有扩展div检测窗口大小，以防止超出窗口屏障

我有一个div，它可以通过jQueryUI拖动，当按下某些功能时，它会向下展开（用不同的CSS值和转换属性设置了展开动画），以显示额外的选项。但是，当div放在页面的较低位置，然后展开时，它会超出页面限制。我希望div仍然可以扩展，但是当底部接触到页面底部时会被向上推

                    $('#normalLegend').draggable({
                        scroll: false,
                        containment: 'window'
                    });     

---

这是我的可拖动div。当拖动到那里时，它不能超出窗口大小，但是如果在窗口边缘附近展开，它将超出窗口屏障。如果点击再次拖动，它将自动校正自身，并将自身居中回到窗口中，但我宁愿它被推上而不是跳到正确的位置

这不是一个好方法，如果用户想让div保持在低位，你不会让它这样做，你的代码总是会将div向上推，这会导致代码出现bug

         $("#normalLegend").draggable({
            appendTo: 'body',
            scroll: false,
            containment: "body"
        });

将appendto添加到body，这样您的滚动条将关闭，div将保持在屏幕上

我建议您从用户的角度重新考虑您的方法