Question

如果我为div设置以下css：

var gulp = require("gulp");
var browserSync = require("browser-sync").create();
var htmlInjector = require("bs-html-injector");

gulp.task("browserSync", function() {
  browserSync.use(htmlInjector, {
    files: ['**/*.*html']
  });
  browserSync.init({
    proxy: 'localhost:1234',
    files: ['Styles*/**/*.css']
  });
});

我用来隐藏滚动条的自定义css被覆盖，默认滚动条出现在iPad上。

这是我用来隐藏滚动条的CSS：

-webkit-overflow-scrolling: touch;

如果您知道在溢出滚动设置为触摸时覆盖默认滚动条的任何解决方案，我将非常感谢您的帮助。

谢谢！

Answer 1

您应该查看一些jQuery custom content scroller插件，尤其是contentTouchScroll: integer这样的选项，它们可以帮助您检测触摸屏，然后再使用它。

OR

否则，可能是更好的解决方案，您应该（如建议的here）使用Modernizr。

if (Modernizr.touch){
   // bind to touchstart, touchmove, etc and watch `event.streamId`
}

为什么不与

同时使用它们

if (Modernizr.touch){
   $(".content").mCustomScrollbar({
       contentTouchScroll: false
   });
}

祝你好运

在iPad上设置溢出滚动触摸覆盖webkit-scrollbar的所有自定义css设置，有没有解决此问题？

1 个答案: