JS Scrollen Aktivieren?

Hi, wie kann man das Scrollen bei JS aktivieren, also ich hab es erst deaktiviert, aber ich möchte, dass wenn ich auf ein Button klicke, ich wieder scrollen kann?

wie geht das?

LG

Answer 1

[Bonifacio]

Um das Scrollen mit JavaScript wieder zu aktivieren, kannst du den CSS-Style overflow des entsprechenden HTML-Elements ändern. Wenn du zum Beispiel das Scrollen auf der gesamten Seite aktivieren möchtest, kannst du den folgenden Code verwenden:

document.body.style.overflow = "auto";

Wenn du das Scrollen nur für ein bestimmtes Element aktivieren möchtest, musst du das entsprechende Element zuerst mit JavaScript auswählen und dann den Style ändern. Beispielsweise:

var element = document.getElementById("meinElement");

element.style.overflow = "auto";

Es ist auch möglich, das Scrollen über das CSS zu deaktivieren, indem man dem body-Tag overflow: hidden zuweist

Comments

[Lenny774]

Danke schonmal, aber document.body.style... funktioniert nicht. Also ich habe folgenden Code:

function menu() {
    document.getElementById("menu-navbar").style.display = "block";
    disableScroll();
}


function exitMenu () {
    document.getElementById("menu-navbar").style.display = "none";
    document.body.style.overflow = "auto";
}

Also es gibt eine Funktion die das Menü anzeigt, und das scrollen deaktiviert mit disableScroll (funktion). Und eins was das schließt, und was das scrollen wieder aktiviert, aber das geht nicht?

[Bonifacio]

@Lenny774

Eine mögliche Lösung könnte sein, die Verwendung von "document.documentElement.style.overflow = 'auto';" anstelle von "document.body.style.overflow = "auto";" zu versuchen.

[Lenny774]

@Bonifacio

Leider auch nicht?

[Lenny774]

@Bonifacio

Der Code für diese ganze disable Scroll ist so:

// 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);
}

[Bonifacio]

@Lenny774

Leider bin ich langsam überfragt :(