2017-07-09 3 views
1

Ich habe eine Konstante in rem s, aber rem selbst ist keine Konstante (abhängig von Medienabfragen und vmin). Für einige Perpoises brauche ich diesen Wert in px.Convert rem zu px ohne Reflow

Natürlich habe ich eine temporäre div erstellen können, setzen Sie seine Größe auf diesen Wert in rem und getComputedStyle es Wert in px zu bekommen. Aber ich würde das gerne tun, ohne einen Reflow zu verursachen, indem ich den berechneten Stil lese.

+0

Sie brauchen mehr klar zu sein. Aus Ihren Kommentaren, glaube ich, können Sie sagen, dass sich der Wert einiger Ihrer untergeordneten Elemente basierend auf Medienabfragen und vmin ändert. Nicht diese rem, die Wurzel em, selbst ändert sich, was nicht wahr ist. – Rob

+0

@Rob, kein 'rem' selbst hängt von Medienabfragen und vmin ab. Aber es gibt andere Änderungen und ich möchte keine Neuberechnung zwischen ihnen erzwingen. – Qwertiy

+0

Noch einmal, entweder sind Sie nicht klar, wie dieser Wert geändert wird oder Sie nicht verstehen, wie rem berechnet wird. Ändern Sie die Schriftgröße auf dem '' Element in irgendeiner Weise? – Rob

Antwort

0

A rem Einheit gleich dem berechneten Wert von ‚font-size 'auf dem Wurzelelement. (https://www.w3.org/TR/2013/CR-css3-values-20130730/#font-relative-lengths)

Sie können das mit 1 rem leicht genug bekommen =

parseInt(getComputedStyle(document.documentElement).fontSize)) 
+0

Warum denkst du, es würde keinen Reflow verursachen? – Qwertiy

+0

Ich weiß, getComputedStyle() wurde gesagt, um Reflow zu verursachen. Bist du sicher, dass das immer noch stimmt? Die Profilerstellung in Safari und Chrome gibt keine Hinweise auf Stilneuberechnungen oder Fensterübermalungen beim Aufruf der Funktion. –

+0

Reflow wird nur verursacht, wenn Sie andere Dom- oder Stiländerungen haben und getComputedStyle danach aufrufen. Ansonsten gibt es nichts neu zu berechnen, so dass kein Reflow auftritt. – Qwertiy