HTML和CSS-垂直滚动条在包含内容的固定高度/宽度窗口中不收缩/调整大小

因此，我试图建立一个网站，并有一个弹出窗口/框，点击后出现的东西。这个弹出窗口包含文本/内容，让我们根据我的网站设计命名它的位置。这个位置弹出框有固定的高度和宽度，因此，我创建了一个垂直滚动条向下滚动并读取文本。我想添加更多的内容到这个弹出窗口，但不幸的是，文本被切断，滚动不继续向下滚动。更具体地说，我如何添加或更改某些内容，使垂直滚动条自身重新调整大小/收缩，以适应我添加的额外文本？目前，窗口中的文本刚刚被截断，我无法向下滚动阅读。在垂直滚动条集成的正确应用中，据我所知，滚动条应该重新调整自身大小，以便可以滚动和读取直到最后的所有文本。如果需要其他代码段，请告诉我。下面是它的CSS：

/* Pop Up */
#popupAbout, #popupLocations, #popupContact, #popupBlog {
    height: 600px;
    width: 900px;
    overflow: scroll;
    background-color: rgba(0, 0, 0, 0.75);
    border: 2px solid #cecece;
    z-index: 15;
    padding: 20px;
    color: #FFF;
    -webkit-box-shadow: 0px 0px 4px #000 inset;
    -moz-box-shadow: 0px 0px 4px #000 inset;
    box-shadow: 0px 0px 4px #000 inset;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    margin-top: -50px;
    visibility: hidden;
}

为了更方便地为我提供帮助，我还添加了JS：

//Locations Page Pop Up
            var popupLocationsStatus = 0;

            function loadPopupLocations(){
                if(popupLocationsStatus==0){
                    $("#popupLocations").fadeIn("slow");
                    popupLocationsStatus = 1;
                }
            }

            function disablePopupLocations(){
                if(popupLocationsStatus==1){
                    $("#popupLocations").fadeOut("slow");
                    popupLocationsStatus = 0;
                }
            }

            function centerPopupLocations(){
                var windowWidth = document.documentElement.clientWidth;
                var windowHeight = document.documentElement.clientHeight;
                var popupLocationsHeight = $("#popupLocations").height();
                var popupLocationsWidth = $("#popupLocations").width();
                $("#popupLocations").css({
                    "position": "absolute",
                    "top": windowHeight/2-popupLocationsHeight/2,
                    "left": windowWidth/2-popupLocationsWidth/2
                });
            }


            $(document).ready(function(){
                $("#popupLocations").fadeOut();
                popupLocationsStatus = 0;
                $("#Locations").click(function(){
                $("#popupLocations").css({
                    "visibility": "visible" });
                    disablePopupAbout();
                    disablePopupContact();                  
                    centerPopupLocations();
                    loadPopupLocations();
                });
                $("#popupLocationsClose").click(function(){
                    disablePopupLocations();
                });
            });
            $(function()
            {
                $('#popupLocations').jScrollPane();
                $('.popupLocations').jScrollPane(
                    {
                        showArrows: true,
                        horizontalGutter: 10
                    }
                );
            });

---

你能发布一个JSFIDLE吗？JSFIDLE就是我们看到代码的地方