jquery jScrollPane:滚动内容高度超出项目列表大小

时间:2014-09-04 16:27:00

标签: javascript jquery jscrollpane

我正在为我的项目使用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个项目的最后一个条件,则会导致问题。滚动内容的高度超过了。我做错了什么?

0 个答案:

没有答案