simplefocus / FlowType.JS

Web typography at its finest: font-size and line-height based on element width.

Home Page:http://simplefocus.com/flowtype/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Fontsize flicking when page load

fckngold opened this issue · comments

Hey folks, have you noticed that when the page loads font first increased and then decreased. It can also be seen on your demo page (http://simplefocus.com/flowtype/demo.html) try to refresh the page a few times and you will see the effect. How to fix that?

I have experienced the same effect on my own site. Is there a way to maybe fade in the text once the js has been loaded?

Fading text in means hiding it on page load. I'm not a fan of this. Not sure how to fix the flicker in a fully accessible way.

In my case, it’s not fading in on page load, but when the next event is shown—the event fades out, text is replaced, and the new text fades in. But with FlowType, it fades in, then jumps to its new size. I was trying to perform the resizing before fading in. Perhaps I could extend it with an onComplete callback.

Try that and report back.

Not really a fix, but I switched to Cycle 2 slideshow, and the problem is solved.