html页面高度固定滚动条,在包含内容的固定高度/宽度窗口中，HTML和CSS垂直滚动条不收缩/调整大小_html_开发99编程知识库...

所以我試圖製作一個網站，並且有一個彈出窗口/框，出現在點擊。 這個彈出窗口包含文本/內容，讓我們根據我的網站設計來 NAME"地點"。 這個位置彈出框具有固定高度和寬度，因此，我創建了垂直滾動條，用於向下滾動並讀取文本。 我想要添加更多的內容，但不幸的是，文本正在被截斷，並且滾動不會繼續滾動。 為了更具體，我如何添加或者更改一些東西，這樣垂直滾動將大小/縮小，以適應額外的文本。 當前，文本只是在窗口中截斷，我不能向下滾動來閱讀它。 在正確的垂直滾動條集成應用中，滾動條應該自身大小，以便所有文本都可以滾動和讀取。 請讓我知道，如果其他代碼Fragment是必要的。 below 是它的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

}

);

});