logo

Jak dočasně zakázat rolování?

Používám plugin scrollTo jQuery a rád bych věděl, jestli je nějak možné dočasně zakázat posouvání prvku okna pomocí Javascriptu? Důvod, proč bych chtěl zakázat posouvání, je ten, že když posouváte během animace scrollTo, je to opravdu ošklivé 😉

Samozřejmě bych mohl udělat $("body").css("overflow", "hidden"); a poté jej přepněte zpět na auto, když se animace zastaví, ale bylo by lepší, kdyby byl posuvník stále viditelný, ale neaktivní.

Odpověď

scroll akci nelze zrušit. Můžete to ale udělat zrušením tyto události interakce:
Myš & Dotkněte se posouvání a Tlačítka spojené s rolováním.

[Pracovní ukázka]

// left: 37, up: 38, right: 39, down: 40,
// spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
var keys = {37: 1, 38: 1, 39: 1, 40: 1};

function preventDefault(e) {
  e.preventDefault();
}

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

// modern Chrome requires { passive: false } when adding event
var supportsPassive = false;
try {
  window.addEventListener("test", null, Object.defineProperty({}, 'passive', {
    get: function () { supportsPassive = true; } 
  }));
} catch(e) {}

var wheelOpt = supportsPassive ? { passive: false } : false;
var wheelEvent = 'onwheel' in document.createElement('div') ? 'wheel' : 'mousewheel';

// call this to Disable
function disableScroll() {
  window.addEventListener('DOMMouseScroll', preventDefault, false); // older FF
  window.addEventListener(wheelEvent, preventDefault, wheelOpt); // modern desktop
  window.addEventListener('touchmove', preventDefault, wheelOpt); // mobile
  window.addEventListener('keydown', preventDefaultForScrollKeys, false);
}

// call this to Enable
function enableScroll() {
  window.removeEventListener('DOMMouseScroll', preventDefault, false);
  window.removeEventListener(wheelEvent, preventDefault, wheelOpt); 
  window.removeEventListener('touchmove', preventDefault, wheelOpt);
  window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}

AKTUALIZACE:Opraven Chrome pro stolní počítače a moderní mobilní prohlížeče s pasivními posluchači