Fixed-Top-Nav-Bar ändert Schriftgröße, wenn Text über html5 Video ist - Problem in Chrome

Question

Ich habe eine Website, die ich lokal arbeite, die eine feste Nav-Leiste und ein HTML5-Video-Element darunter mit einer Höhe von 500px enthält. Die Menüeinträge in der Navigationsleiste haben etwas, das wie eine Reduzierung des Schriftgewichts aussieht, oder eine Art von "Webkit-Schriftartglättung": Problem, aber nur wenn das Video nach dem Scrollen über die Navigationsleiste auf das korrekte Gewicht zurückgesetzt wird .

Dies ist nur in Chrome passiert, es war auch in Safari passiert, aber es geschafft, das zu beheben mit der Schriftart: 100% ;.

Jede Hilfe oder Vorschläge würden sehr geschätzt werden, da ich den ganzen Tag nach Antworten gesucht habe. Vielen Dank.

Answer 1

Ich habe auch das gleiche Problem, ohne jede Lösung.

Ich habe versucht, die Schriftart zu ändern, aber alles, was ich getestet habe, werden unterschiedlich wiedergegeben, wenn ein Videoelement überlagert wird. Weder ich hatte Erfolg mit Workaround mit webkit CSS-Eigenschaften wie -webkit-font-smoothing oder -webkit-text-stroke.

Da ich eine Suche gemacht habe, die ich herausgefunden habe, scheint es ein bekanntes Problem in Bezug auf Google Chrome zu sein.

http://code.google.com/p/chromium/issues/detail?id=74674

http://code.google.com/p/chromium/issues/detail?id=100666

Answer 2

Webkit hat manchmal Probleme mit Elementen in Echtzeit-Rendering, wenn Sie viel passiert auf der Seite auf einmal haben - vor allem in Ihrem JS. Fügen Sie diese an das übergeordnete Element Ihrer „sticky“ Navigation im CSS:

/* Change this to your selector */ 
.someStickyNavParent { 
    -webkit-backface-visibility: hidden; 
} 

Wenn Sie immer noch in ein Problem laufen mit den Kindern dieses Elements, Sie immer einen universellen Selektor verwenden können.

/* Change this to your selector */ 
.someStickyNavParent * { 
    -webkit-backface-visibility: hidden; 
}