Ich habe eine Seite, auf der ich Ajax-Inhalte dynamisch laden muss, wenn der Benutzer nach unten scrollt. Das Problem ist, dass JQuery nicht die richtige Fensterhöhe zurückgibt. Ich habe diese Funktion bereits verwendet und habe noch nie gesehen, dass sie fehlschlägt. Aus irgendeinem Grund wird jedoch derselbe Wert wie die Dokumenthöhe zurückgegeben. Ich habe die Testseite hier: bangstyle.com/test-images

Ich habe die Warnung so codiert, dass sie beim Laden der Seite angezeigt wird und auch, wenn der Benutzer 500 Pixel unter den oberen Rand scrollt:

function scroller() {

                        if($(window).scrollTop() > 500){

                        delay(function(){ //200ms wait
                                pagecounter++;
                                sideshow();
                                alert("window height: " + $(window).height() + " scrolltop: " + $(window).scrollTop() + " document height: " + $(document).height());

                                return false;
                            }, 200 );

                                    }
                            }

Ich habe bereits versucht, dies zu veröffentlichen, aber ich habe es gelöscht, da ich keine Lösung gefunden habe. Ich hoffe, es ist in Ordnung, einen Link zu meiner Testseite zu veröffentlichen. Übrigens habe ich dies auf Mac Safari und Mac FF getestet. Ich habe den gleichen Code auf anderen Seiten ausgeführt und es funktioniert gut. Ich denke, es muss etwas im Dom dieser Seite geben, das JS zum Scheitern bringt, aber keine Ahnung, was das sein würde.

24
Joel Joel Binks 8 Okt. 2012 im 22:27

7 Antworten

Beste Antwort

Sehen Sie sich Ihren HTML-Quellcode an. Die erste Zeile sollte <!DOCTYPE html> sein und Sie haben stattdessen das Tag <style>.

Es scheint also, dass Ihr Dokument im Quirks-Modus ausgeführt wird und jQuery die korrekten Fensterabmessungen nicht berechnen kann.

78
Inferpse 8 Okt. 2012 im 18:58
//works in chrome
$(window).bind('scroll', function(ev){

    //get the viewport height. i.e. this is the viewable browser window height
    var clientHeight = document.body.clientHeight,
        //height of the window/document. $(window).height() and $(document).height() also return this value.
        windowHeight = $(this).outerHeight(),
        //current top position of the window scroll. Seems this *only* works when bound inside of a scoll event.
        scrollY = $(this).scrollTop();

    if( windowHeight - clientHeight === scrollY ){
        console.log('bottom');
    }

});
3
Geuis 8 Okt. 2012 im 19:17

Haben sich einige umgesehen und sind darauf gestoßen, wissen nicht, ob es hilft, aber es lohnt sich, darauf einzugehen.

Warum ist $ (Fenster) .height () so falsch?

0
Community 23 Mai 2017 im 12:31

Ich hatte das gleiche Problem. Ich habe einige Dinge gefunden:

1) Das Problem tritt auf, wenn Sie versuchen, die tatsächliche Höhe zu ermitteln, bevor das Dokument vollständig gerendert ist. 2) Das Problem tritt in Google Chrome auf, wenn Sie Corret DOCTYPE nicht verwenden (siehe oben). 3) Es tritt immer in Google Chrome auf, auch wenn das Dokument vollständig gerendert wurde.

Für Google Chrome habe ich hier eine Problemumgehung gefunden: get-document- Höhen-Cross-Browser Ich verwende diese Lösung nur für Google Chrome und sie hat mein Problem gelöst. Ich gehe davon aus, dass sie jemandem hilft, der das Problem noch hat.

3
Pontual 27 März 2013 im 14:51

Da jquery (und dom im Allgemeinen) die Größen im Quirksmode nicht korrekt berechnet, gibt es zwei Lösungen:

  1. Fügen Sie Doctype HTML oben auf Ihrer Seite hinzu (wie in der "richtigen" Antwort erwähnt), oder
  2. Verwenden Sie window.innerHeight, window.innerWidth, wenn die erste Option keine Option ist.

Ich hoffe es hilft.

0
Lex 13 Aug. 2015 im 02:54

Ich habe meine Skripte von in die Fußzeile verschoben und das hat es für mich gelöst.

0
harrykirsten 27 Okt. 2017 im 22:57

Dies ist eine alte Frage, aber ich hatte kürzlich Probleme, die richtige Fensterhöhe in IE10 um einige Pixel nicht zu erreichen.

Ich habe festgestellt, dass IE10 standardmäßig einen 75% -Zoom anwendet und die Fenster- und Dokumentmessungen verschraubt.

Wenn Sie also eine falsche Breite oder Höhe erhalten, stellen Sie sicher, dass der Zoom auf 100% eingestellt ist.

2
ozzysong 27 Apr. 2014 im 07:50