3

我有一个具有交互式滚动条的水平 iScroll 实例。

    myScroll = new IScroll('#wrapper', { 
        scrollX: true, 
        scrollY: false, 
        mouseWheel: false,
        scrollbars: 'custom',
        interactiveScrollbars: true,
        resizeScrollbars: false,
        bindToWrapper: false,
        click: true,
        fadeScrollbars: true,
    });

我希望在 iScroll 隐藏指示器时隐藏它display: none的display滚动条（

当我将浏览器从小视口调整为大视口时，通常会发生这种情况。

fadeScrollbars不完全是我想要的，因为它隐藏了滚动条和指示器，即使它仍然可以滚动。

如果指示器隐藏，如何将 iScroll 配置为不显示滚动条？

有什么解决方法吗？

4

3 回答 3

0

很久以前添加了这个问题，但我通过向库添加一些额外的代码解决了这个问题 - 在 v5.1.3 中，我发现方法 refresh 开头是一些“如果条件”：

if ( this.options.listenX && !this.options.listenY ) {
        this.indicatorStyle.display = this.scroller.hasHorizontalScroll ? 'block' : 'none';
    } else if ( this.options.listenY && !this.options.listenX ) {
        this.indicatorStyle.display = this.scroller.hasVerticalScroll ? 'block' : 'none';
    } else {
        this.indicatorStyle.display = this.scroller.hasHorizontalScroll || this.scroller.hasVerticalScroll ? 'block' : 'none';
    }

改成

if ( this.options.listenX && !this.options.listenY ) {
        this.indicatorStyle.display = this.scroller.hasHorizontalScroll ? 'block' : 'none';
        this.wrapper.style.display = this.scroller.hasHorizontalScroll ? 'block' : 'none';
    } else if ( this.options.listenY && !this.options.listenX ) {
        this.indicatorStyle.display = this.scroller.hasVerticalScroll ? 'block' : 'none';
        this.wrapper.style.display = this.scroller.hasVerticalScroll ? 'block' : 'none';
    } else {
        this.indicatorStyle.display = this.scroller.hasHorizontalScroll || this.scroller.hasVerticalScroll ? 'block' : 'none';
        this.wrapper.style.display = this.scroller.hasHorizontalScroll || this.scroller.hasVerticalScroll ? 'block' : 'none';
    }
于 2015-09-02T14:17:11.060 回答
0

有一个使用 jQuery 的解决方法（只需检查指示器是否隐藏并隐藏滚动条）：

if($('#wrapper .iScrollIndicator').is(':hidden')) {
    $('#wrapper .iScrollVerticalScrollbar').hide();
}
于 2017-12-04T19:16:35.663 回答
0

你想要那样吗？添加hideScrollbars: true你的代码

myScroll = new IScroll('#wrapper', {  
        hideScrollbars: true,
        listenX: true,
        scrollX: true, 
        scrollY: false, 
        mouseWheel: false,
        scrollbars: 'custom',
        interactiveScrollbars: true,
        resizeScrollbars: false,
        bindToWrapper: false,
        click: true,
        fadeScrollbars: true,
    });
于 2019-07-17T01:51:08.670 回答