Nemrég játszottam egy kicsit a Google Web Fonts rendszerrel.
Egyszerű és nagyszerű technológia. :)
Sajnos szembesülnöm kellett azzal, hogy a különböző böngészők a font-family értékét JavaScript-ben nem ugyanúgy kezelik. Főleg, ha az adott betűkészlet még nincs is betöltve.
Egy egyszerű CSS szabály:
font-family: 'Mountains of Christmas',arial,serif;
}
Két lekérés. Az első elem a fenti CSS osztályt kapja meg, a másik elem style-ból kapja meg ugyanazt.
cls: 'mountains'
});
var el2 = Ext.getBody().createChild({
style: "font-family: 'Mountains of Christmas',arial,serif;"
});
Ext.getBody().createChild({
tag: 'pre',
html: el1.getStyle('font-family') + "\n" +
el2.getStyle('font-family')
});
Eredmények:
Firefox + IE:
'Mountains of Christmas',arial,serif
Chrome + Safari:
'Mountains of Christmas', arial, serif
(egy-egy szóköz bekerült)
És végül az Opera:
"Mountains of Christmas", "arial", serif
Azaz, ha egy be nem töltött betűkészletet szeretnék lekérni, ami nem style-ből, hanem class-ból jön, akkor az bizony az Operának nem sikerül. A style verzió is némileg megváltozott.
Az első verziónál a document.styleSheets –en keresztül elérhető a betűkészlet neve, de azért ez úgy kicsit macerás. :(
