ползунок диапазона нельзя перетащить в IOS - PullRequest
0 голосов
/ 05 октября 2019

Я пишу на инструменте рисования веб-приложения. Когда я тестирую на Ipad, браузеры (сафари и хром) будут иметь эффект отскока при рисовании на холсте. Я пробовал решение от Michael P iOS: отключить отскок прокрутки, но разрешить нормальную прокрутку .

var content = document.getElementById('scrollDiv');

content.addEventListener('touchstart', function(event) {
    this.allowUp = (this.scrollTop > 0);
    this.allowDown = (this.scrollTop < this.scrollHeight - this.clientHeight);
    this.slideBeginY = event.pageY;
});

content.addEventListener('touchmove', function(event) {
    var up = (event.pageY > this.slideBeginY);
    var down = (event.pageY < this.slideBeginY);
    this.slideBeginY = event.pageY;
    if ((up && this.allowUp) || (down && this.allowDown)) {
        event.stopPropagation();
    }
    else {
        event.preventDefault();
    }
});

Эффект отскока был устранен, но мой ползунок диапазона больше нельзя перетаскивать.

HTML:

  <input type="range" on-tap="onTap($event)" on-drag="onTap($event)" class="custom-range" id="sizeRange" min="0" max="200">

JS:

 //brush slider
    var slider = document.getElementById("sizeRange");
    var output = document.getElementById("sizeValue");
    output.innerHTML = slider.value = stWeight;

    slider.oninput = function() {
            stWeight = output.innerHTML = this.value;

    }
...