BullGuard Antivirus Sale - 60% Off with openElement !
openElement Website Homepage
Forum Home Forum Home >

openElement

> Error Reports
  New Posts New Posts RSS Feed - Fonts flashing [SOLVED]
  FAQ FAQ  Forum Search   Register Register  Login Login

Fonts flashing [SOLVED]

 Post Reply Post Reply
Author
Message
digizar View Drop Down
Senior Member
Senior Member
Avatar

Joined: 30 Dec 2015
Location: Germany Frankf
Status: Offline
Points: 619
Post Options Post Options   Thanks (0) Thanks(0)   Quote digizar Quote  Post ReplyReply Direct Link To This Post Topic: Fonts flashing [SOLVED]
    Posted: 29 Dec 2017 at 21:11
Why is the displayed text on this (and others) page flashing?
First it comes up to the screen in a completely different font style,
which is the selected standard font of the FireFox (or any other) browser.
The expected size an color of the font ist ok during reception.
It does not matter which font or font family is selected in the CSS-Style.

After all information of this page did arrive, the fonts will be 'corrected' to the CSS-specified type.
That is a nono.

How can this be avoided or corrected, so the font would already be displayed correctly during the reception of the page content?

Sample domain (not complete yet):
https://pummelchen.org



Edited by digizar - 30 Dec 2017 at 18:50
___________________________________
Ask questions only if there is no answer yet.
https://digispics.com/_pers/resger2017.pdf
Back to Top
Dmit OE View Drop Down
Admin Group
Admin Group
Avatar

Joined: 31 Mai 2012
Status: Offline
Points: 5278
Post Options Post Options   Thanks (1) Thanks(1)   Quote Dmit OE Quote  Post ReplyReply Direct Link To This Post Posted: 30 Dec 2017 at 14:34
Hi,

You page is very light, so it appears almost instantly, before the webfont is loaded. You can either try to choose the page font to be something "standard" but closer to the webfont, or like on a number of websites make a "loader" - do not let user see the page until it is fully loaded. The simplest way to try is to show a white full-screen tag then hide it on page loaded, add a Code Block Visual with the code:


<div id="loader" style="position: fixed !important; z-index: 1000000 !important; left:0;top:0;right:0;bottom:0;width:100%;height:100%;background-color:white;"></div>
<script>
$(function(){
  setTimeout(function(){ $('#loader').fadeOut("slow"); }, 500);
});
</script>

Back to Top
digizar View Drop Down
Senior Member
Senior Member
Avatar

Joined: 30 Dec 2015
Location: Germany Frankf
Status: Offline
Points: 619
Post Options Post Options   Thanks (0) Thanks(0)   Quote digizar Quote  Post ReplyReply Direct Link To This Post Posted: 30 Dec 2017 at 18:50
Very nice, it works. Thanks o much.
-digi-
Have a nice trip into the next year. :-)
___________________________________
Ask questions only if there is no answer yet.
https://digispics.com/_pers/resger2017.pdf
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 10.11
Copyright ©2001-2012 Web Wiz Ltd.

This page was generated in 0,016 seconds.