84

Wie kann ich in Javascript erkennen, ob der Benutzer einen Bildlauf durchführt?

javascript

— user1365010
quelle

Nein, ich möchte von einer anderen Funktion schreiben if(scolling). Ist if(window.onscroll)das gleich

— user1365010

Sie können scrollingin der einstellen onscroll. (ps: nein, das ist nicht dasselbe)

— Rocket Hazmat

3

Der Benutzer "scrollt nie". Es gibt nur eine Bildlaufaktion, keinen Bildlaufstatus.

— Kendall Frey

1

@ user1365010: D'OH! Daran habe ich nicht gedacht. Was genau versuchst du zu tun? Warum müssen Sie wissen, ob der Benutzer einen Bildlauf durchführt?

— Rocket Hazmat

2

Interessant. Ich habe noch nie eine Schriftrolle neu gestartet. Möchtest du das näher erläutern?

— Kendall Frey

85

das funktioniert:

window.onscroll = function (e) {  
// called when the window is scrolled.  
}

bearbeiten:

Sie sagten, dies sei eine Funktion in einem TimeInterval.
Versuchen Sie es so:

userHasScrolled = false;
window.onscroll = function (e)
{
    userHasScrolled = true;
}

Fügen Sie dann in Ihr Intervall Folgendes ein:

if(userHasScrolled)
{
//do your code here
userHasScrolled = false;
}

— Wampie Driessen
quelle

Aber es ist eine Funktion in einem setInterval!

— user1365010

4

@ user1365010: Was ist? Worüber redest du? Sie müssen der Frage weitere Details hinzufügen.

— Rocket Hazmat

6

@ user1365010 Diese Antwort ist (im Kern) die beste, die Sie tun können.

— Matt Ball

#FYI, es scheint nicht zu wachen, als der Container gescrollt hat, body.scroll () funktioniert, also habe ich beide hinzugefügt

— Selva Ganapathi

12

Du hast gerade Javascript in deinen Tags gesagt, also könnte dir der Beitrag von @Wampie Driessen helfen.

Ich möchte auch einen Beitrag leisten, damit Sie bei Verwendung von jQuery Folgendes verwenden können, wenn Sie es benötigen.

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

Ein anderes Beispiel:

$(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);
    });
});

— Oscar Jara
quelle

2

Soll jQuery nicht Browserunterschiede abstrahieren? Warum haben Sie Methoden für verschiedene Browser? Ist das $('#elem').bind('scroll'nicht gut genug EDIT: Egal, ich habe dein 2. Beispiel gesehen.

— Rocket Hazmat

1

Mit ein wenig nativem Javascript ist ab und zu nichts falsch.

— AGDM

Meinst du nicht e.originalEvent.wheelDelta || e.originalEvent.detail?

— Jacob RossDev

2

WARNUNG: Die Radereignisse in dieser Antwort sind nicht standardisiert und veraltet. Verwenden Sie das wheelEreignis.

— Alexander O'Mara

Ich habe dies nicht getestet, aber laut MDN wird DOMMouseScroll in den meisten Browsern nicht unterstützt. Developer.mozilla.org/en-US/docs/Web/Events/DOMMouseScroll

— Liron Yahdav

5

window.addEventListener("scroll",function(){
    window.lastScrollTime = new Date().getTime()
});
function is_scrolling() {
    return window.lastScrollTime && new Date().getTime() < window.lastScrollTime + 500
}

Ändern Sie die 500 in die Anzahl der Millisekunden nach dem letzten Bildlaufereignis, bei dem Sie den Benutzer als "nicht mehr scrollend" betrachten.

( addEventListenerist besser als onScrollweil der erstere gut mit jedem anderen Code koexistieren kann, der verwendet onScroll.)

— Silas S. Brown
quelle

0

Verwenden Sie zur Überprüfung ein Intervall

Sie können ein Intervall einrichten, um zu überprüfen, ob der Benutzer gescrollt hat, und dann etwas entsprechend zu tun.

Aus dem großen John Resig in seinem Artikel entlehnt .

Beispiel:

    let didScroll = false;

    window.onscroll = () => didScroll = true;

    setInterval(() => {
        if ( didScroll ) {
            didScroll = false;
            console.log('Someone scrolled me!')
        }
    }, 250);

Siehe Live-Beispiel

— hitautodestruct
quelle

Erkennen Sie, ob der Benutzer einen Bildlauf durchführt

Verwenden Sie zur Überprüfung ein Intervall