{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 手持菜刀，她持情操 的问题《Apache cordova on android where are scrollbars?》','https://www.manongdao.com/q-1364291.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I try to build a simple app with cordova which target android
I just want to have a scrollable div but
- if the content is smaller than the div's height, the scrollbar is always visible
- if the content is bigger than the div's height, the scrollbar never appear, even if I scroll : the scroll is possible but no scrollbar position indication
My layout is simple :
<body>
<div id='views'>
<div class='view'>
Lorem ipsum ...
</div>
</div>
</body>
Css is simple too :
#views {
position : absolute;
top:0; right:0; bottom:0; left:0;
}
.view {
position : absolute;
top:0; right:0; bottom:0; left:0;
overflow-x : hidden;
overflow-y : scroll;
-webkit-overflow-scrolling : touch;
overflow-scrolling : touch;
}
Then I use command : cordova run android
note :
- I use cordova version 3.3.1-0.3.1
- test on Nexus 7 updated (android kitkat)
- with last android API : 19
Thanks for your help
edit : I just try with iOs simulator (iOS 6.1), the scrollbars are visibles when I scroll ...
[updated] Thanks to help me. Here is is the correct code to have scrollbars on android
[updated 2] It's not totally ok, try this, the whole window scroll, not only the .view content
HTML
<body>
<div id='views'>
<div class='view'>
Lorem ipsum ...
</div>
</div>
<div id='menu-bt'></div>
</body>
CSS
.view {
position:absolute;
top:0; right:0; bottom:0; left:0;
overflow:visible;
-webkit-overflow-scrolling:touch;
overflow-scrolling:touch;
}
#menu-bt {
position:absolute;
right:40px; bottom:40px;
width:50px; height:50px;
background-color:green;
}
Then, add this line in file /plateforms/android/src/io/cordova/myProject/MyProject.java
super.appView.setVerticalScrollBarEnabled(true);
Tested here and changing your overflows to
visibleit works.Also, make sure to enable the scrollbars in your Android Activity file (as pointed here) by adding the following line:
Go to: SystemWebViewEngine.java which located in yourAppName\platforms\android\CordovaLib\src\org\apache\cordova\SystemWebViewEngine.java
Set
webView.setVerticalScrollBarEnabled(true);