Jak mogę wykryć w javascript, czy użytkownik przewija?
javascript
user1365010
źródło
źródło
if(scolling)
. Jestif(window.onscroll)
taki sam?scrolling
wonscroll
. (ps: nie, to nie to samo)Odpowiedzi:
to działa:
window.onscroll = function (e) { // called when the window is scrolled. }
edytować:
powiedziałeś, że to funkcja w przedziale czasu.
Spróbuj zrobić to tak:
userHasScrolled = false; window.onscroll = function (e) { userHasScrolled = true; }
następnie w swoim Interval wstaw to:
if(userHasScrolled) { //do your code here userHasScrolled = false; }
źródło
Właśnie powiedziałeś javascript w swoich tagach, więc post @Wampie Driessen może ci pomóc.
Chcę również wnieść swój wkład, więc jeśli potrzebujesz, możesz użyć następujących elementów podczas korzystania z jQuery.
//Firefox $('#elem').bind('DOMMouseScroll', function(e){ if(e.detail > 0) { //scroll down console.log('Down'); }else { //scroll up console.log('Up'); } //prevent page fom scrolling return false; }); //IE, Opera, Safari $('#elem').bind('mousewheel', function(e){ if(e.wheelDelta< 0) { //scroll down console.log('Down'); }else { //scroll up console.log('Up'); } //prevent page fom scrolling return false; });
Inny przykład:
$(function(){ var _top = $(window).scrollTop(); var _direction; $(window).scroll(function(){ var _cur_top = $(window).scrollTop(); if(_top < _cur_top) { _direction = 'down'; } else { _direction = 'up'; } _top = _cur_top; console.log(_direction); }); });
źródło
$('#elem').bind('scroll'
nie wystarczająco dobry? EDYCJA: Nieważne, widziałem twój drugi przykład.e.originalEvent.wheelDelta || e.originalEvent.detail
?wheel
wydarzenia.window.addEventListener("scroll",function(){ window.lastScrollTime = new Date().getTime() }); function is_scrolling() { return window.lastScrollTime && new Date().getTime() < window.lastScrollTime + 500 }
Zmień wartość 500 na liczbę milisekund po ostatnim zdarzeniu przewijania, przy której użytkownik „przestał przewijać”.
(
addEventListener
jest lepsze niż to,onScroll
że ten pierwszy może ładnie współistnieć z każdym innym kodem, który używaonScroll
).źródło
Użyj interwału, aby sprawdzić
Możesz ustawić interwał, aby sprawdzać, czy użytkownik przewinął, a następnie zrób coś odpowiednio.
Pożyczenie od wielkiego Johna Resiga w swoim artykule .
Przykład:
let didScroll = false; window.onscroll = () => didScroll = true; setInterval(() => { if ( didScroll ) { didScroll = false; console.log('Someone scrolled me!') } }, 250);
Zobacz przykład na żywo
źródło