我正在为我的项目使用jScrollPane插件。在我的项目中,有一个可以滚动的项目列表。稍后将从xml加载项目。最初有2个项目。问题是最初滚动面板的高度超过了主要的内容尺寸。即使不超过2个项目,滚动条也会向下移动。我的代码如下:
<script>
$('#scrollerContent').jScrollPane();
</script>
<body>
<div id="container" style="max-height:229; visibility:hidden">
<div id="scrollerContent" style="max-height:229">
<div id="1stContent">1stContent</div>
<div id="2ndContent">2ndContent</div>
<div id="3rdContent">3rdContent</div>
<div id="4thContent">4thContent</div>
</div>
</div>
</body>
项目列表是从鼠标点击事件加载的:
<div id="listBar" onClick="loadItems()"></div>
loadItems(){
var divHeight=145;
if(itemLoaded){
if(3rdItemLoaded){
document.getElementByID("3rdContent").style.visibility= visible;
document.getElementByID("container").style.height= divHeight+ "px";
document.getElementByID("scrollerContent").style.height= divHeight+ "px";
}
if(4thItemLoaded){
document.getElementByID("4thContent").style.visibility= visible;
document.getElementByID("container").style.height= divHeight+ "px";
document.getElementByID("scrollerContent").style.height= divHeight+ "px";
}
}
else{ //By default 2 items loaded
var divHeight= 145;
document.getElementByID("1stContent").style.visibility= visible;
document.getElementByID("2ndContent").style.visibility= visible;
document.getElementByID("container").style.height= divHeight+ "px";
document.getElementByID("scrollerContent").style.height= divHeight+ "px";
}
}
如果程序达到默认情况下加载2个项目的最后一个条件,则会导致问题。滚动内容的高度超过了。我做错了什么?