Archive for November, 2008

Typeface.js

Tuesday, November 11th, 2008

Typeface.js er et rimeligt interessant stykke software. Interessant fordi det uden problemer tillader en at bruge fonte i websites selvom næsten ingen endnu har implementeret @font-face css-reglen.

Jeg skriver at det er uden problemer og det er en sandhed med modifikationer. Det er problemfrit når man bare bruger det som tekst rendering og ikke forventer at det kan redde verden. Det virker i de fleste grade A browsere. Lige netop det at det ikke virker i alle grade A browsere er det som denne artikel handler om.

I Opera virker det nemlig overhovedet ikke. Det påstås heller ikke fra forfatterens side, men det virkede lidt underligt at det ikke skulle virke, for Opera plejer at opføre sig ordentligt det meste af tiden.

Efter en hurtig omgang debugging i typeface kilden med Operas indbyggede debugger værktøj, fandt jeg ud af at Opera opfattede at de elementer som skulle have specielle fonte, skulle renderes med Arial. Det er jo ikke rigtigt til at forstå, eftersom Arial ikke var i stylesheet’et. Jeg kom frem til at Opera måtte smide specialfonten væk, fordi den ikke kunne finde den, og så bruge det den troede man havde brug for i stedet.

Efter en del søgen på det store Internet fandt jeg et indlæg i Operas developer forum om emnet. Det som Operas udvikler svarer er at de har taget en design beslutning og implementeret det på den måde de har. w3’s specifikation på området omkring computed styles (den værdi som der bliver hentet ud i dette tilfælde, og som indeholder beregnede værdier af de værdier som står i stylesheet’et) er yderst vag, og den beskriver kun at man skal lave pixel beregninger og sørge for at inherit værdier er ændret til de værdier som skal bruges. Mozilla skriver i deres developer central wiki at de faktisk har snydt lidt og bruger used styles som resultat af computed styl, men det ændrer ikke ved at de returnerer det rigtige resultat, nemlig en streng som indeholder en kommasepereret liste af de fonte som er i stylesheet’et. Forhåbentligt går der ikke mange dage før Opera har rettet op på denne fejl. Indlægget blev besvaret i går af en af deres udviklere og han skriver:

This was by design but will be “fixed” :smile:

Så man har to valg:

  • Vente og se hvornår de får implementeret den nye funktionalitet
  • Implementere en traversering af tilknyttede stylesheets for at finde de regler som berører netop de elementer man har brug for

I dette tilfælde vil det nok være lidt nyttesløst at vælge det sidste, eftersom der ikke er nok der bruger Opera til at det giver mening, derudover er Opera ikke en standardbrowser på nogen platform, så folk der bruger Opera kan se siden i mindst én anden browser.

Hvis man endelig skulle vælge vej nummer 2 og kigge stylesheet’ene igennem, så skulle man nok implementere et fuldt css bibliotek, som også vil kunne bruges til at udjævne forskelle mellem browsere i forhold til implementationer af nuværende standarder og også i forhold til at implementere kommende standarder, indtil browserne selv gør det. Javascript er jo netop nået et punkt hvor det er gjort så hurtigt at det ikke vil betyde store ventetider at have store scripts.

z-index og ie 6

Tuesday, November 11th, 2008

Dette er viden som skulle have været ubrugelig for længe siden, men folk er ignorante, og derfor skal vi stadig supportere forældede browsere.

Den browser som givers os flest problemer er jo selvfølgeligt Microsofts Internet Explorer version 6.

En af de utallige bugs vi har haft problemer med er at vi har nogle popup-elementer som sidder på vores brugerprofiler. Det virker som det skal i alle andre browsere, men ie6 synes ikke at det z-index popup-elementet har fået er godt nok og derfor vil den måske kunne skjule det bag andre elementer.

Måden den skjuler elementet på var dog ikke lige til at finde ud af, for det var kun nogen elementer der gemte popup’en. Efter lidt undersøgelse fandt jeg at de elementer der skjuler popup-elementet var relativt positioneret. og det element som popupen var i også var relativt positioneret. Det viser sig nemlig at ie6 ikke er tilfreds med at hvert element har deres helt eget z-index. I stedet siger den at den boks som elementet er inden i ligger i et lag for sig selv, som ingen andre elementer udefra kan komme imellem.

Dette betyder at man kan komme et hvilket som helst z-index på popup-elementet, det er stadig relativt i forhold til det element det er indeni. Og elementer der kommer umiddelbart efter vil, i kraft af at de kommer senere i dokumentet, overlappe ved “by-design” at have et højere z-index (på en måde). For atfå ie6 til at tegne det ordentligt, så bliver man nødt til at sætte z-index’et på popup-elementets relative parent til et andet højt z-index.

For mere dybdegående information: http://aplus.rs/lab/z-pos/