16:49 提问
移动端滚动条的美化及控制问题
在移动端嵌入h5页面，在h5页面里使用css修改滚动条样式,如图
在浏览器、微信、qq环境下滚动条都不能拖动，只有在安卓原生app里可以拖动，ios原
生app都不行。
分析了安卓系统下的网页，
css修是的是这块的滚动条（我把它理解为页面的滚动条）
ios下不能大幅度的快速滚动，安卓下快速滚动页面会出现系统的滚动条，如图
现在非常疑惑页面的滚动条为什么不能拖动？
按赞数排序
可浮动属性有没有设置呢？
浏览器兼容性有没有考虑呢？
准确详细的回答，更有利于被提问者采纳，从而获得C币。复制、灌水、广告等回答会被删除，是时候展现真正的技术了！
其他相关推荐DIV实现纵向滚动条overflow-y:scroll的使用-css教程-ab蓝学网
DIV实现纵向滚动条overflow-y:scroll的使用，1.首先设置固定div的宽高2.overflow-y:scroll如果设置overflow:表示当你内容超过div高度出现滚动条...
DIV实现纵向滚动条overflow-y:scroll的使用，
1.首先设置固定div的宽高
2.overflow-y:scroll
如果设置overflow:表示当你内容超过div高度出现滚动条
overflow语法如下：
overflow : visible | auto | hidden | scroll
visible :不剪切内容也不添加滚动条。假如显式声明此默认值，对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效
auto : 此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条
hidden : 不显示超过对象尺寸的内容
scroll : 总是显示滚动条
上编：下编：
本月热门的内容
1 2 3 4 5 6 7 8 9 10
最近更新的内容插件描述：手机端页面滑动效果，请在手机上查看效果，或在浏览器中模拟手机端查看，直接电脑端浏览器无法查看效果。
请在手机上查看效果，或在浏览器中模拟手机端查看，直接电脑端浏览器无法查看效果。============以下内容由&&提供===========调用方法(function(){
&&&&&&&&//配置
&&&&&&&&var&config&=&{
&&&&&&&& 'audio':{
'icon':'audio-record-play',
'text':true
&&&&&&&& },
&&&&&&&& 'loading':&'loading-ic'
&&&&&&&&};
&&&&&&&&//loading
&&&&&&&&window.onload&=&function(){
&&&&&&&& $('#loading').hide();
&&&&&&&&//分享
&&&&&&&&$('#js-btn-share').bind('tap',function(){
&&&&&&&& $('#js-share').show();
&&&&&&&&})
&&&&&&&&$('#js-share').bind('tap',function(){
&&&&&&&& $(this).hide();
&&&&&&&&});
&&&&&&&&var&pageIndex&=&1,
&&&&&&&& pageTotal&=&$('.page').length,
&&&&&&&& towards&=&{&up:1,&right:2,&down:3,&left:4},
&&&&&&&& isAnimating&=&
&&&&&&&&//禁用手机默认的触屏滚动行为
&&&&&&&&document.addEventListener('touchmove',function(event){
&&&&&&&& event.preventDefault();&},false);
&&&&&&&&$(document).swipeUp(function(){
&&&&&&&& if&(isAnimating)&
&&&&&&&& if&(pageIndex&&&pageTotal)&{&
pageIndex+=1;&
&&&&&&&& }else{
pageIndex=1;
&&&&&&&& };
&&&&&&&& pageMove(towards.up);
&&&&&&&&})
&&&&&&&&$(document).swipeDown(function(){
&&&&&&&& if&(isAnimating)&
&&&&&&&& if&(pageIndex&&&1)&{&
pageIndex-=1;&
&&&&&&&& }else{
pageIndex=pageT
&&&&&&&& };
&&&&&&&& pageMove(towards.down);
&&&&&&&&})
&&&&&&&&function&pageMove(tw){
&&&&&&&& var&lastP
&&&&&&&& if(tw=='1'){
if(pageIndex==1){
lastPage&=&&.page-&+pageT
lastPage&=&&.page-&+(pageIndex-1);
&&&&&&&& }else&if(tw=='3'){
if(pageIndex==pageTotal){
lastPage&=&&.page-1&;
lastPage&=&&.page-&+(pageIndex+1);
&&&&&&&& }
&&&&&&&& var&nowPage&=&&.page-&+pageI
&&&&&&&& switch(tw)&{
case&towards.up:
outClass&=&'pt-page-moveToTop';
inClass&=&'pt-page-moveFromBottom';
case&towards.down:
outClass&=&'pt-page-moveToBottom';
inClass&=&'pt-page-moveFromTop';
&&&&&&&& }
&&&&&&&& isAnimating&=&
&&&&&&&& $(nowPage).removeClass(&hide&);
&&&&&&&& $(lastPage).addClass(outClass);
&&&&&&&& $(nowPage).addClass(inClass);
&&&&&&&& setTimeout(function(){
$(lastPage).removeClass('page-current');
$(lastPage).removeClass(outClass);
$(lastPage).addClass(&hide&);
$(lastPage).find(&img&).addClass(&hide&);
$(nowPage).addClass('page-current');
$(nowPage).removeClass(inClass);
$(nowPage).find(&img&).removeClass(&hide&);
isAnimating&=&
&&&&&&&& },600);
&&&&&&&&})();==============以下内容由&&提供=================花了重金下载了这个插件，有些心得，分享分享第一，替换page.css里面的.page-1{&background-image:&url(../img/1_01.png);}只要替换图片路径即可设置为背景图，图1、图2以此类推。第二，在index.html页面里面&div&class=&page&page-1&page-current&&&/div&的各个div page里面添加元素是不能定位的，你可以添加一些navbar-fixed-bottom &（定位到底部）一些样式，我使用的是bootstrap框架，挺好用的，用navbar-fixed-top定位到头部。第三，貌似不用引入JQ包，引入后会报错，估计是zepto.min.js这个js和jq包冲突了，在这里我就只用dom节点来实现。第四，页面的各个图片是无限循环的，想要不循环，只要改if(tw=='1'){
&&&&&&&&&&if(pageIndex==1){
&&&&&&&&&&&&&&lastPage&=&&.page-&+pageT
&&&&&&&&&&}else{
&&&&&&&&&&&&&&lastPage&=&&.page-&+(pageIndex-1);
&&&&&&&&&&}
&&&&&&&&}else&if(tw=='3'){
&&&&&&&&&&&&if(pageIndex==pageTotal){
&&&&&&&& lastPage&=&&.page-1&;
&&&&&&&&&&&&}
&&&&&&&&}else{
&&&&&&&&&&&&&lastPage&=&&.page-&+(pageIndex+1);
&&&&&&&&}为if(tw=='1'){
&&&&&&&&&&&&if(pageIndex==1){
&&&&&&&&&&&&&&&&lastPage&=&&.page-&+(pageTotal-1);
&&&&&&&&&&&&}else{
&&&&&&&&&&&&&&&&lastPage&=&&.page-&+(pageIndex-1);
&&&&&&&&&&&&}
&&&&&&&&}else&if(tw=='3'){
&&&&&&&&&&&&if(pageIndex==pageTotal){
&&&&&&&&&&&&&&&&lastPage&=&&.page-1&;
&&&&&&&&&&&&}else{
&&&&&&&&&&&&&&&&lastPage&=&&.page-&+(pageIndex+1);
&&&&&&&&&&&&}
&&&&&&&&}就可以了。第五，在微信浏览器使用该插件，最好清空缓存，不然修改了都没感觉！（这点可以不注意）============== 以下代码由 &提供&=========================这个其实是中通的那个的简化版，文件夹中有个animation的css 他都没有用，其实这个animation很有用的，每个不同的图片放上不同的animation就可以动起来了，具体做法比如&img&class=&img_3&hide&fadeInRight&&src=&img/txt1.png&&/&class中 img_3定义了图片的位置，大小，等等的元素hide自然就是隐藏fadeInRight是渐出效果，具体的效果有很多，可以一个一个尝试
相关插件-滚动,滑块和旋转,移动
讨论这个项目（64）回答他人问题或分享插件使用方法奖励jQ币
真的很不错，就是没钱买
&项目正好需要，小弟不会做，求一份代码，谢谢
??陌心???绝?恋?0
这女孩很乖 0
谁有源代码啊，帮忙发份，谢谢
无用代码骗我分
buptquan 0
这不是北邮某学长
BillGatesTan. 0
&然而我还是选择用SuperSlide、TouchSlide& swiper & fullpage &这些插件去模拟 &哈哈 &开玩笑 大兄弟这原生很6 小生佩服
这个可以直接用swpier模拟 可以去swiper官网直接弄出来 开源的哦 &能帮你们的只能到这了 &少花冤枉的jq币&
清新薄荷猫 0
我用的其他人的代码也是无限循环,醉了
有点小bug，在我手机看的时候没有全屏显示
求下载的源文件 &谢谢
PROMULGATOR
永恒与回忆
广东省广州市
关注作者 (45)
收藏此插件 (368)
我当前jQ币余额：正在获取..
已下载次数：2171
所需jQ币：3当前位置：
(html)移动端h5页面，滚动时的滚动条是否可以去掉
(html)移动端h5页面，滚动时的滚动条是否可以去掉
来源：网络整理&&&&&时间: 21:55:59&&&&&关键词:
关于网友提出的“ (html)移动端h5页面，滚动时的滚动条是否可以去掉
”问题疑问，本网通过在网上对“ (html)移动端h5页面，滚动时的滚动条是否可以去掉
”有关的相关答案进行了整理，供用户进行参考，详细问题解答如下：
问题： (html)移动端h5页面，滚动时的滚动条是否可以去掉
描述:请问有没有办法可以去掉这个滚动条的？&!DOCTYPE html&
&title&测试&/title&
&meta charset="utf-8"&
&meta name="viewport" c /&
height: 14
width: 100%;
overflow-x:
-webkit-overflow-scrolling:
height: 14
width: 500
padding: 0;
margin: 0;
padding: 0;
margin: 0;
height: 14
font-size: 12
line-height: 14
width: 100
&li&你的名字&/li&
&li&你的名字&/li&
&li&你的名字&/li&
&li&你的名字&/li&
&li&你的名字&/li&
&/html&解决方案1:::-webkit-scrollbar:{display: width:0; height: 0;}解决方案2:/隐藏横向和纵向滚动条/::-webkit-scrollbar {
width: 0}::-webkit-scrollbar:horizontal {
height: 0}解决方案3:用插件swiper.js解决方案4:1.网上找一个插件，恩可以说是最简单的方法2.就是楼上说的那种，内部高，然后隐藏掉滚动条解决方案5:1.overflow:然后touchmove事件自己写滚动效果。2.或者再包一层wrap,设置overflow:hidden。ul放在wrap里比wrap稍高，但是滚动条藏在wrap的hidden部分里。解决方案6:使用overflow:将超出显示区域的地方隐藏，就不会出现滚动条了
以上介绍了“ (html)移动端h5页面，滚动时的滚动条是否可以去掉”的问题解答，希望对有需要的网友有所帮助。
本文网址链接：http://www.codes51.com/itwd/4202254.html
上一篇： 下一篇：如何设置iscroll滚动条样式 | 任寒韬-好学使人进步}