使滚动条在离子内容中可见

使滚动条在离子内容中可见

本文介绍了使用本机滚动时,使滚动条在离子内容中可见的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用 overflow-scroll =true使离子使用原生卷动:

I am using overflow-scroll = "true" to make ionic use native scrolling :

 <ion-content overflow-scroll = "true">
   <ion-list>
     <ion-item ng-repeat="foo in bar">
       {{foo.label}}
     </ion-item>
   </ion-list>
 </ion-content>

这真的很不错(表现真的不错)。唯一的问题是,(垂直)滚动条消失。

This really works great (performances are really good). The only problem is that the (vertical) scrollbar disappeared.

根据,我尝试添加 scrollbar-y =true ion-content ,但是无效。

As per the documentation, I tried adding scrollbar-y="true" to ion-content, but that didn't work.

我也尝试添加到我的css:

I also tried adding this to my css :

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical {
    width: 11px;
}

::-webkit-scrollbar:horizontal {
    height: 11px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: rgba(0, 0, 0, .5);
}

::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}

...但无效。

(寻找本机滚动)说,问题可以使用css解决,虽然。

This article (look for "native scrolling") says that the problem can be solved using css, though.

有人知道如何做吗?

推荐答案

a href =http://stackoverflow.com/questions/22866285/phonegap-3-0-android-native-scrollbar-not-visible>由@GerhardCarbó建议的答案最接近我找到到目前为止的解决方案...它的工作,但是:

The answer suggested by @Gerhard Carbó is closest I've found to a solution so far... It does kind of work but :


  • 滚动条不自动隐藏

  • 动画非常不稳定

所以我相信我现在不会使用滚动条。

So I believe I'll stick with no scrollbar for now.

另外请注意,这在Android上的谷歌Chrome上工作正常,所以希望它会被修复有一天。但是为什么webview是如此之多的铬,我不明白...

Also please note this works fine on Google Chrome on android, so hopefully it's going to be fixed someday. But why is webview is so much behind chrome, I fail to understand...

这篇关于使用本机滚动时,使滚动条在离子内容中可见的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-24 01:46