我在android phonegap中创建了应用程序。我使用iscoll在div中动态显示滚动条我已经附加了列表并动态显示。
它显示带附加列表的div,但不显示滚动条。
在logcat中我收到以下错误:
03-21 16:09:02.669: WARN/webview(2166): Miss a drag as we are waiting for WebCore's response for touch down
。
我的代码是
我使用cubiq.org/iscroll-4来显示滚动条
滚动条的js是
<script type="text/javascript" charset="utf-8" src="iscroll.js"></script>
<script type="text/javascript">
显示滚动条的功能
var scroll1;
function loaded() {
scroll1 = new iScroll('standard');
}
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', loaded, false);
</script>
滚动条的css
<style type="text/css" media="all">
body {
font-size:12px;
-webkit-user-select:none;
-webkit-text-size-adjust:none;
font-family:helvetica;
padding:20px;
}
#standard {
position:relative; z-index:1;
display:block; float:left;
width:100px; height:150px;
background:#aaa;
overflow:auto;
border:1px solid #aaa;
}
#standard {
margin-right:20px;
}
.scroller {
position:absolute; z-index:1;
-webkit-tap-highlight-color:rgba(0,0,0,0);
width:100%;
padding:0;
}
</style>
我添加了div(id="list")
的附加列表以及带有div(id="button")
<div id="standard">
<div class="scroller">
<div id="button"></div>
<div id="list">
</div>
</div>
</div>
如何用动态div显示scroollbar。请指导我。提前谢谢
答案 0 :(得分:3)
我假设您正在谈论水平滚动,当属性 hScroll 默认为true时。如果它是垂直的,则在创建iScroll元素时,还需要将 vScroll 设置为true。
如果您拥有动态生成的列表,则需要使用scroll1.refresh()
来注意生成的内容。
此外,由于iScroll将其切换为overflow:auto
,因此不需要overflow:hidden
#standard。
但是就像在文档中所说的那样,让iScroll工作的最好方法是将结构设置为(我假设你已经拥有):
<div id='ScrollWrapper'>
<ul>
<li>content</li>
</ul>
</div>