Truputį pertraukiame dirbdami paiešką, kad išspręstume nedidelį dalyką.
„FOUT“ yra „nestilingo teksto blykstė“. Tai yra reiškinys, kai @ font-face šriftus reikia šiek tiek įkelti, taigi prieš pasirinktinį šriftą matote atsarginį šriftą. Paprastai tai nėra „Typekit“ problema. Šiais laikais tai tikrai nėra šiuolaikinių naršyklių problema (išskyrus IE 9). Tačiau tai yra mūsų problema, nes mes pasirinkome asinchroniškai įkelti „Typekit JavaScript“.
Vis dėlto viltis neprarandama, „Typekit“ turi šią problemą, mums tiesiog reikia atlikti daugybę darbų mūsų svetainėje. Mes įdėjome naują klasės pavadinimą į elementą, vadinamą „wf-loading“ (žiniatinklio šrifto įkėlimas). Tada savo CSS skelbiame, kad bet kuris pasirinktinis, kuris naudoja pasirinktinį šriftą, yra akivaizdžiai paslėptas, kol tas klasės pavadinimas išnyks. Galima pagalvoti apie šiek tiek rizikingą, bet jei šrifto nepavyksta įkelti, vis tiek yra laikas, kuris pašalina klasę. Tai skirta tik kovai, kad nepamirštumėte, tik šiek tiek vizualaus malonumo.
Visa tai darome sukurdami nedidelį „Sass“ @mixin
pavadinimą „preventFOUT“ ir įtraukdami @include
jį į savo pasirinktinius šriftų kaupiklius , kurie taip pat yra @mixin
s.
Tai mums dabar gerai tinka. Pagal šį dizainą mes pereiname prie HF & J šriftų, kurie įkeliami tiesiogiai per @ font-face, todėl iš esmės nustojame dėl to nerimauti.