Heim > Web-Frontend > js-Tutorial > Wie kann ich das Scrollen während jQuery scrollTo-Animationen vorübergehend deaktivieren?

Wie kann ich das Scrollen während jQuery scrollTo-Animationen vorübergehend deaktivieren?

Mary-Kate Olsen
Freigeben: 2024-12-20 01:57:09
Original
797 Leute haben es durchsucht

How Can I Temporarily Disable Scrolling During jQuery scrollTo Animations?

Vorübergehendes Deaktivieren des Scrollens während der jQuery scrollTo-Animation

Bei Verwendung des scrollTo-Plugins von jQuery kann das Scrollen die Glätte der Animation beeinträchtigen. Während Sie die Bildlaufleiste einfach ausblenden könnten, ist es eine bessere Lösung, das Scrollen vorübergehend zu deaktivieren, ohne seine Sichtbarkeit zu beeinträchtigen.

Lösung

Anstatt nur auf das Scroll-Ereignis abzuzielen, Der Schlüssel besteht darin, auch damit verbundene Interaktionsereignisse wie Maus-, Berührungs- und Tasten-Scrolls abzubrechen. Hier ist ein Skript, das Sie verwenden können:

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

// Enable scrolling
function enableScroll() {
  window.removeEventListener('DOMMouseScroll', preventDefault, false);
  window.removeEventListener(wheelEvent, preventDefault, wheelOpt); 
  window.removeEventListener('touchmove', preventDefault, wheelOpt);
  window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}
Nach dem Login kopieren

Jetzt können Sie das Scrollen deaktivieren, indem Sie „disableScroll()“ aufrufen und es bei Bedarf mit „enableScroll()“ wieder aktivieren.

Das obige ist der detaillierte Inhalt vonWie kann ich das Scrollen während jQuery scrollTo-Animationen vorübergehend deaktivieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage