Ionic 2 - 如何禁用滚动-Java 学习之路

首先：我知道有一些关于这方面的话题，但它们似乎都没有帮助我 .

我尝试了所有可以在我的某个页面上禁用滚动的方法，但是没有一个能够工作，所以我来这里寻求帮助 .

我尝试了什么：

创建一个隐藏溢出的css类（与attr.noScroll相同）
setScrollDisabled
将div设置为离子固定
离子含量无反弹
:: - webkit-scrollbar
overflow-scroll = "false"

这就是我的页面看起来像......

It has this white bar on the bottom of the screen when I scroll down

我只添加了一个背景图片，其宽度我设置为100％，高度：auto（高度：100％产生相同的白色条）

作为参考，这是我的代码，如果它有帮助

<ion-content>
  <img class="bgc" src="assets/background.png">
</ion-content>

2 回答

2
要修复它，你应该明白是什么导致它，所以你可能想要read this .

在某些特殊情况下，您可以通过禁用滚动来隐藏该空白区域，但这不是您应该如何处理此问题 .
相反，您应该删除空白区域 . 你可以通过申请来做到这一点
```
display: block;
```
... 要么 ...
```
float: left;
width: 100%;
height: auto;
```
到你的 <img> 元素 .

作为替代方案，您可以将标记更改为：
```
<ion-content>
  <img class="bgc" src="assets/background.png"
/></ion-content>
```
回复于 2024-05-06T20:40:32+08:00

滚动事件无法取消 . 但是你可以通过取消这些交互事件来实现：鼠标和触摸滚动以及与滚动相关的按钮 .

http://output.jsbin.com/xatidu/4/ < - 工作版

var keys = {37: 1, 38: 1, 39: 1, 40: 1};

function preventDefault(e) {
  e = e || window.event;
  if (e.preventDefault)
      e.preventDefault();
  e.returnValue = false;  
}

function preventDefaultForScrollKeys(e) {
    if (keys[e.keyCode]) {
        preventDefault(e);
        return false;
    }
}

function disableScroll() {
  if (window.addEventListener) // older FF
      window.addEventListener('DOMMouseScroll', preventDefault, false);
  window.onwheel = preventDefault; // modern standard
  window.onmousewheel = document.onmousewheel = preventDefault; // older browsers, IE
  window.ontouchmove  = preventDefault; // mobile
  document.onkeydown  = preventDefaultForScrollKeys;
}

function enableScroll() {
    if (window.removeEventListener)
        window.removeEventListener('DOMMouseScroll', preventDefault, false);
    window.onmousewheel = document.onmousewheel = null; 
    window.onwheel = null; 
    window.ontouchmove = null;  
    document.onkeydown = null;  
}

回复于 2024-05-06T20:40:32+08:00

Ionic 2 - 如何禁用滚动

2 回答

相关问题