• Heim > Web-Frontend > js-Tutorial > jQuery-Scroll-Ereignis zur Implementierung der Überwachung des Scrollbar-Pagings example_jquery

    jQuery-Scroll-Ereignis zur Implementierung der Überwachung des Scrollbar-Pagings example_jquery

    WBOY
    Freigeben: 2016-05-16 16:53:24
    Original
    1093 Leute haben es durchsucht

    Das Scroll-Ereignis gilt für Fensterobjekte, kann aber auch durch Iframe-Elemente scrollen, wenn die CSS-Überlaufeigenschaft auf Scrollen eingestellt ist.

    Code kopieren Der Code lautet wie folgt:

    $(document).ready(function ( ) { / / Ich bin es gewohnt, so zu schreiben
    $(window).scroll(function () {
    //$(window).scrollTop() Diese Methode ist der aktuelle Bildlaufabstand der Bildlaufleiste
    //$(window ).height() Ruft die Höhe des aktuellen Formulars ab
    //$(document).height() Ruft die Höhe des aktuellen Dokuments ab
    var bot = 50; //bot is the Höhe von unten
    if ( (bot $(window).scrollTop()) >= ($(document).height() - $(window).height())) {
                                                                                                                                                                                                         Die Höhe - die Höhe des Formulars;                                                                                            });
    }
    });
    });

    Beachten Sie den Unterschied zwischen: (window).height() und (document).height()

    jQuery(window).height() stellt die Größe des aktuell sichtbaren Bereichs dar, während jQuery(document).height() die Höhe des gesamten Dokuments darstellt, das je nach Situation verwendet werden kann.

    Beachten Sie, dass sich jQuery(window).height() entsprechend ändert, wenn sich die Größe des Browserfensters ändert (z. B. nach dem Maximieren oder Vergrößern des Fensters), jQuery(document).height() jedoch unverändert bleibt.


    $(document).scrollTop() Ruft den Abstand des vertikalen Scrollens ab, d. h. den Abstand vom oberen Rand des Fensters, in dem Sie gerade scrollen, zum oberen Rand der gesamten Seite $(document).scrollLeft( ) Dies ist der Abstand, um den die horizontale Bildlaufleiste erreicht wird


    Um die Spitze zu erhalten, müssen Sie nur scrollTop()==0 erhalten, was die Spitze ist

    Um ganz nach unten zu gelangen, rufen Sie einfach scrollTop()>=$(document).height()-$(window).height() auf. Dann wissen Sie, dass Sie nach unten gescrollt haben


    Kopieren Sie den Code Der Code lautet wie folgt:
    $(document).height() //Ermitteln Sie die Höhe von die gesamte Seite
    $(window ).height() //Damit wird die aktuelle Höhe des Teils der Seite ermittelt, den Ihr Browser sehen kann. Diese Größe ändert sich, wenn Sie in das Browserfenster hinein- und herauszoomen. Es unterscheidet sich vom Dokument. Es sollte auf Englisch verständlich sein


    Machen Sie einfach ein Experiment und Sie werden es wissen


    Kopieren Sie den Code Der Code lautet wie folgt:
    $(document).scroll(function(){
    $("#lb").text($(document ).scrollTop());
    })



    Verwandte Etiketten:
    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
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage