Ermitteln Sie die Mögliche Maximale DIV-Höhe

Gibt es eine empfohlene Weg, um zu bestimmen, die maximale Höhe, die ein DIV kann festgelegt werden und sichtbar bleiben, per browser? Dies scheint nicht dokumentiert werden überall und ist hoch-die Umsetzung-spezifisch.

Beispielsweise sehen Sie die folgende test-Skript:

http://jsfiddle.net/NP5Pa/2/

Dies ist ein einfacher test, um den maximalen Wert können Sie einen DIV style height-Attribut vor der entsprechenden clientHeight des Elements, wird zu 0. Sie können dies überprüfen, indem Sie auf "Find Max" dann erhöht die gefunden die Höhe von 1 und klicken auf "Höhe Festlegen".

Einige Beispiele (Win7/64):

Chrome (14.0) :    134,217,726 px
Safari (5.1)  :    134,217,726 px
IE (9.0)      :     10,737,418 px
FF (7.0.1)    :     17,895,697 px

Ist es nicht verwunderlich, dass das WebKit-führt zum selben Ergebnis, denke ich - mehr verwunderlich, dass der IE und FF sind so unterschiedlich.

Gibt es eine bessere Möglichkeit? Und bekommt man unterschiedliche Ergebnisse bei 32bit-Systemen?

--EDIT: Aktualisiert die Geige halt in 10,000,000,000 (und es schneller) für die Oper. Das ist eine Menge von Pixeln.

  • Ich upvote diese Frage einfach durch wie dunkel es ist.
  • Ja, ich weiß, es kam in einer realen situation, obwohl ('virtuellen' scrollers auf datagrids bei sehr großen Tabellen).
  • Ihre demo scheint nie zu Ende, in der Oper. Es scheint, dass clientHeight ist nie zu 0.
  • Aktualisiert es als pro für den Kommentar. Ist es sichtbar, dass die Größe?
  • Kredit-Oper für nicht mit eine max. 10 Millionen microsoft? Das ist leicht überschritten, in einem Kommentar-thread, wenn sich Leute beschweren sich über änderungen an der schriftart auf facebook. /troll
  • Die aktualisierte demo funktioniert, wie erwartet, in der Oper. Ja, es ist immer noch sichtbar.
  • danke! Ich Frage mich, ob es tatsächlich immer so groß ist, oder wenn sich die Oper ist empfindlich genug, um zu denken, über den Rand Fall und einschränken, so dass es sichtbar bleibt. So oder so, gehen Opera!
  • Aus spät chrome (Version 21), scheint die Unterstützung von max 35791389px nur 1/3 des früheren max
  • Darf ich Fragen, wie Sie gelöst die max Höhe Problem mit virtual scrolling?

InformationsquelleAutor Hamish | 2011-10-10
  1. 12

    Dies ist Ihr code, angepasst an binäre Suche (also viel schneller).

    http://jsfiddle.net/thai/zkuGv/4/

    Beginnt es bei 1 pixel und die Verdoppelung der Größe, bis die es trifft, die maximale (ich benutze 253, ist die größte ganze Zahl, die gespeichert werden können in JavaScript ohne an Präzision zu verlieren und die binäre Suche buggy), oder die div bricht auf null pixel.

    Angenommen, wir setzen die div-Größe h, und es verschwindet, dann ist die maximale Größe muss zwischen h/2 und h. Wir binäre Suche von dort aus für eine Höhe h, die nicht der div verschwindet bei der Einstellung der Höhe h, aber verschwindet, wenn die Einstellung h+1.

    Dann können wir zu einem Ergebnis kommen für die Oper: 2147483583 Pixel.

    • Diese js-fiddle war sehr hilfreich, aber eine interessante Sache, die ich fand, ist, dass nach einem bestimmten Punkt, der Browser anscheinend einige, die maximale Höhe haben, können Sie das div und einfach clip etwas größer, die Höhe - und zu einem späteren Zeitpunkt, sehen wir die 0-Höhe der divs. Aber es ist das clipping, das verursacht Probleme für mich. Hier eine leicht geänderte version der fiddle: jsfiddle.net/zkuGv/16 hab ich getestet mit Chrome und IE 11 und kam auf folgende zahlen: - Chrom ist gut, bis 25,165,824 px - IE 11 Probleme bei 1,533,917 px habe ich wirklich Zweifel, die Zahl geht in die Milliarden für die Oper.
    • Basierend auf meinen eigenen Tests mit reagieren-virtualisiert ich denke Chrome ist bis zu ~33,5 Millionen jetzt. Mindestens das ist, wo scrollTop wird gestoppt. Sie können die position von Elementen, die weiter unten (wenigstens ein bisschen) mit top aber Sie werden nicht in der Lage, Blättern Sie zu Ihnen.
    InformationsquelleAutor Thai
  2. 0

    Hier versuchen Sie dies: http://jsfiddle.net/serkanyersen/yNfuX/

    Es wird die Achtung der Eltern, die padding-und margin-Eigenschaften. Wenn Sie klicken Sie auf die Schaltfläche MAX, DIV wird erweitert, um den meisten verfügbaren Speicherplatz. Ich bin sicher, Sie können konvertieren Sie diese nach Ihren Bedürfnissen.

    Muss man eigentlich rekursiv, ausgehend von sich selbst an die Spitze, aber ich hatte keine Zeit, zu realisieren, dass.

    HINWEIS: Versuchen Sie, ändern der Größe der Seite, und heben Sie die Auskommentierung der Eltern-DIV zu sehen, es vollständig funktioniert.

    • "Sichtbar bleiben" - Teil ist verwirrend. Scheinbar ist dies nicht die Antwort, die Sie suchen.
    InformationsquelleAutor Serkan Yersen
Schreibe einen Kommentar