2009-05-20 5 views
6

Ich habe ein Plugin erstellt, das ich auf die bloßen Knochen eines Plugins (d. H. Keine Funktionalität, nur die Struktur) reduziert habe, um dieses Problem zu debuggen und es existiert noch. Es befasst sich mit der Größenänderung von divs und basiert dies auf der Dokumentbreite.JQuery Fensterbreite nicht korrekt in Chrome

Das Problem ist, dass die Breite der Dokumente gemeldet um 17px von seiner tatsächlichen Breite reduziert wird und die Größe der Divs nicht korrekt ist.

Ich habe in der Benachrichtigung setzen, um herauszufinden, wo das Problem auftritt: Vor „ready“ -Funktion: 1780px (richtige Breite) Im Innern der „ready“ -Funktion: 1763px Im Innern des Plugin: 1763px (alle Werte wieder aus "document.width" und "$ (document) .width()" mit gleichen Ergebnissen)

Dies geschieht nur innerhalb von Chrome und bleibt selbst mit dem Plugin effektiv auf nichts reduziert.

Irgendwelche Gedanken darüber, warum das passiert?

+0

könnte die Größe der Bildlaufleisten werden abgezogen. Irgendein Code würde helfen, das Problem zu lokalisieren. – Magnar

+0

Ich habe es auf einen spezifischeren Ort eingeschränkt. Wenn vor der Bereit-Funktion eine Warnung angezeigt wird, werden die Divs nach dem Klicken auf OK korrekt gerendert. Wenn diese Warnung entfernt wird, wird die tatsächliche Breite um 17 Pixel zurückgesetzt. Gibt es noch andere Ereignisse oder etwas anderes, was passiert, wenn die Warnung angezeigt wird? – Stuart

+1

Ich habe gerade den Platzhaltertext entfernt, der Bildlaufleisten erzwang, und die Lücke wurde jetzt auf einen Platz im Bildlaufleistenformat reduziert. Ich denke du hast Recht, dass die Scrollbarbreite subtrahiert wurde. Irgendwelche Ideen für eine Problemumgehung? – Stuart

Antwort

2

Ich habe festgestellt, dass jQuery (window) .width() einen falschen Wert in Safari und Chrome zurückgibt.

+1

Webkit entspricht nicht den W3C-Standards zur Definition der Breite. Es enthält die Bildlaufleiste in der Fensterbreite, obwohl die Spezifikation es nicht sollte. Boooo! – dudewad

3

von jQuery documentation genommen:

Während JavaScript, um die Last Ereignis zum Ausführen von Code bereitstellt, wenn eine Seite gerendert wird, wird dieses Ereignis nicht , bis alle Vermögenswerte wie Bilder vollständig empfangen wurden ausgelöst werden. In den meisten Fällen kann das Skript ausgeführt werden, sobald die DOM-Hierarchie vollständig erstellt wurde. Der Handler hat an .ready() übergeben ist garantiert ausgeführt, nachdem das DOM bereit ist, so Dies ist in der Regel der beste Ort zu alle anderen Ereignishandler und anderen jQuery-Code ausführen. Bei Verwendung von Skripten, die auf dem Wert von CSS Stileigenschaften basieren, ist es wichtig, Referenz externe Stylesheets oder einzubetten Stilelemente vor Bezug auf die Skripts.

In Fällen, in denen geladene Code auf Vermögen beruht (beispielsweise wenn die Abmessungen eines Bildes erforderlich sind), wird der Code sollte stattdessen in einem Handler für das Ereignis Last gelegt werden.

Sie sollten wahrscheinlich

$(window).load(function() {}); 

als Triggerereignis verwendet werden

+0

Wenn Sie $ (window) .width() in die Konsole setzen, ist es auch falsch. Es kommt nicht darauf an, wann es aufgerufen wird, es ist eine Frage von Chrome, die Scrollbar als Teil der Breite über CSS einzubeziehen, aber in JS verwendet es die Fensterbreite mit abgezogener Scrollleiste. – Sawtaytoes