fonts laden

Status
Niet open voor verdere reacties.

jos-willem

Gebruiker
Lid geworden
1 okt 2000
Berichten
42
Ik wil op me website een font gebruiken die niet standaard is in windows/mac. Nu had ik een manier gevonden waarmee je je font van je site kon laten laden en dan zou het moeten werken maar dat was niet zo.

Dat ging zo

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Load Fonts</title>
<style>
@font-face {
font-family: "04b";
src: url("http://www.mesite.nl/font_file_04b.ttf");
}
</style>
</head>

<body>

<font color="#000000" size="3" face="04b">text using special font</font>

</body>
</html>

Wie weet hoe je zoiets wel werkend krijgt?
Enne aan me ondersteuning van css 2 ligt het niet
 
ik mis wat; nl het media type en een selector:

Code:
    <STYLE TYPE="text/css" MEDIA="screen">
      @font-face {
        font-family: blaat;
        src: url("http://jouwsite/map/blaat")
      }
      body { font-family: blaat, sans-serif }
<style>

t.
 
Laatst bewerkt:
Re: helpt niet

Geplaatst door jos-willem
Nou het helpt niet zoals jullie het beschrijven...
Wat helpt niet? Effe duidelijker zijn, dan kunnen wij er wellicht wel iets mee.
 
font gebruiken

Ik wil een font gebruiken die in de pc/mac niet standaard is... als je deze font gebruiken wil moet je hem eerst downloaden. Nou had ik een script gevonden (zie bovenin me eerste bericht) waarmee het probleem mee opgelost zou moeten zijn. Nou dat werkt dus niet en daarom vraag ik het hier... de mogelijke oplossingen die zonet hier geplaatst zijn werken helaas niet.
 
Dan mis je wellicht toch wel een stukje css2??

geef anders eens een url zodat we mee kunnen kijken..

En lukt het echt niet is er nog altijd WEFT (IE only).
 
Als je nu even microsofts weft download dan kan je het ttf bestand (wat niet geslikt wordt door browsers) even omzetten naar een eot bestand (die wel geslikt wordt door browsers)

dan gaat je css er dus zo uitzien:
Code:
    <STYLE TYPE="text/css" MEDIA="screen">
      @font-face  
     {
     font-family: blaat;
     src: url([url]http://jouwsite/map/bestand.eot[/url]);
     }
     
     body 
     { 
      font-family: blaat; 
     }
<style>

dan moet het werken.

t.

ps let je dus wel even op "en ; enzo..
 
hij wil niet

Nou ik heb het programma gedownload en de website eens bekeken en het ziet er allemaal wel goed uit maar als ik me ttf wil omzetten dan loopt het programma helemaal vast. Gisteravond heb ik hem aangezet en ben film gaan kijken maar na 2 uur was hij nog bezig. Ik krijg het dus niet voor elkaar en ik snap het programma ook niet helemaal...


Wat kan ik het beste doen?

Trouwens alvast bedankt voor je tijd en moeite!
 
ehm.. tja, dat is weer een software probleempje vrees ik.

t.
 
Het werkt maar

Perfect het werkt! maar nu is er een nieuw probleem ontstaan.

De font die ik gebruik is mooi als hij max 8pt groot is. De mac ondersteund de speciale fonts niet dus heb ik gezegt dat hij dan arial moet gebruiken. Het probleem is dat als je een standaard font gebruikt dat die pas mooi is op minimaal 9 pt want anders is het niet te lezen.


Me vraag is dus:

Hoe kan ik via css ervoor zorgen dat als arial gebruikt wordt dat die op 9 pt wordt getoond en als ik me eigen speciale font gebruik dat deze 8 pt groot is.
 
Je zou met JS het OS uit kunnen lezen en daarmee de juiste CSS kiezen; vooral IE5+ op de mac heeft een speciale behandeling nodig.

Voordat je je daarin gaat storten; bekijk eens hoeveel % mac bezoekers je hebt. Weegt dat op tegen de extra tijd die je erin gaat steken?

t.
 
helaas

Helaas zijn dat er genoeg.... de doelgroep bestaat uit 40% mac gebruikers... ik heb besloten om het voor een tijd op verdana te houden omdat er te veel gedoe is om het te laten werekn voor de mac. Ik hoop dat ze over een tijd voor dit probeel eens wat maken en dat het voor alle OS'en werkt.

Zowiezo bedankt voor je hulp want de methode kan ik zeker wel gebruiken op een andere pagina.


Groetjes,

Jos-Willem
 
Ik ben tegen exact dezelfde problemen aangelopen, dus even een voorbeeldje dan:

Code:
  if (navgator.appVersion.indexOf('Win') != -1) {
     document.write("<link rel='stylesheet' href='stylesheet_voor_windows.css' type='text/css'>") 
  } else {
     document.write("<link rel='stylesheet' href='stylesheet_voor_MAC.css' type='text/css'>")
  }

plak die in de head van je documenten en schrijf dus 2 aparte stylesheets. (mac's hebben een andere interpretatie van lettergrootte, maar dat wist je al).


grtzz

t.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan