10
votes

Détecter si une police particulière est installée

Comment détecter si une police particulière est installée ou non à l'aide de JavaScript uniquement. (Ne comptez pas si cela est activé ou non).

merci


0 commentaires

7 Réponses :


-1
votes

Que diriez-vous de faire ce que le reste du monde fait: Spécifiez la police avec CSS et proposez des retombées? Aucune application ne devrait jamais besoin em> pour savoir quelles polices sont disponibles, ni une façon fiable de le faire. (Vous devrez probablement imprimer caché de div avec la police et la mesurer pour voir si les dimensions sont ce que vous attendiez, mais ce serait extrêmement fragile.)

Just Go pour: P>

body { font-family: MyFont, Helvetica, Arial, sans-serif }


4 commentaires

Dans mon cas, je souhaite détecter si une police amharique est installée, pour que vous sachiez un cas d'utilisation valide pour avoir besoin de savoir si une police particulière est installée.


Et si vous travaillez dans un environnement qui n'a pas de CSS? E.g Paper.js


Pas besoin d'être un imbécile à ce sujet; Il se pourrait bien y avoir des situations où vous voulez détecter la présence d'une police. Par exemple. Est-ce que j'essaie de télécharger la police de Google ou est-ce déjà présent? C'est millisecondes à télécharger, mais il y a une limite de clé API qui permet de minimiser la police tire une bonne idée. En outre, la question ne contient pas de conflit avec l'offre de retombées, etc.; Vous pouvez le faire aussi.


Certaines applications devraient savoir quelles sont les polices disponibles - j'écris une application Web de lecture électronique pour les enfants et on m'a demandé de fournir une liste de choisies de polices, y compris les comic Sans, qui n'existe pas sur tous les systèmes. . J'ai besoin de savoir si cela existe pour que je sache si vous devez l'offrir comme une option dans un menu déroulant ou non.



0
votes

@Matchu vous a suggéré à juste titre, mais voici ce que vous recherchez:

http://remysharp.com/2008/07/08/how-a-detect-if-a-font-is-installed-only-utilisant-javascript/


3 commentaires

Cette solution ne fonctionnera pas dans tous les cas. Il repose sur une police particulière étant installée, mais cela ne sera pas toujours vrai.


Bien oui il y a ça aussi! :-)


Cela, malgré son acceptation, est une réponse pauvre et frontalière uniquement.



0
votes

Les déclarations de la famille de polices doivent suffire à fournir une baisse au cas où la police que vous souhaitez utiliser n'est pas présente.

Mais si vous avez vraiment besoin d'utiliser une police spéciale sur votre site, bien que cela utilise JavaScript, je recommanderais Cufon Comme c'est la solution la plus cross-navigateur, il existe une solution CSS3 (déclarations de police), mais cela ne fonctionne pas encore dans tous les navigateurs.


4 commentaires

@Pointy non, font-face pas. C'est une fonctionnalité CSS3 uniquement.


@Seb qui est incorrect, monsieur. webfont.info/wiki/...


@Pointy qu'est-ce que ce lien est censé vouloir dire? Qu'un seul navigateur prend en charge une fonctionnalité donnée ne signifie pas que c'est d'une ou d'une autre technologie! Font-face est CSS3, malgré les navigateurs le soutenir. Ce que je disais, c'est que, bien que cela puisse fonctionner sur, cela ne fonctionnera pas partout , comme vous êtes heureux.


Ah, bien ok ça a du sens. Cependant, à ma connaissance, il fonctionne dans la majorité des navigateurs utilisés où cela fait une différence (c'est-à-dire que cela ne fonctionne pas dans Lynx, mais le problème de base ici n'est pas pertinent là aussi). Je suppose que le plus grand trou est Pre-3.5 Firefox, non?



1
votes

Si vous avez absolument besoin d'une police spécifique, tous vos visiteurs doivent avoir des navigateurs actuels. Ensuite, vous pouvez utiliser Webfont.

Si ce n'est pas une option, vous devez rendre la police sur votre serveur et servir une image.


1 commentaires

IE6 prend en charge les polices téléchargées.



7
votes

Voici une solution pour vérifier si la police est installée dans votre périphérique dans une page HTML. L'idée est la suivante: Créez une police étroite extrême et définissez-la dans CSS avec URL de l'objet de données, vérifiez la largeur de la police cible avec cette police.

Voici l'exemple: p>

checkFontAvailable("微软雅黑333")
false
checkFontAvailable("微软雅黑")
true
checkFontAvailable("arial")
true
checkFontAvailable("arial black")
true


0 commentaires

2
votes

Mettez ce code n'importe où dans votre fichier JavaScript.

console.log(isFontAvailable('thisdoesntexists'))
// Evaluates false


0 commentaires

3
votes

La dernière réponse a été fournie il y a 11 ans. Entre-temps, de nouvelles solutions sont disponibles pour les personnes qui recherchent toujours une solution:

vous pouvez utiliser le FontFaceset API fourni par navigateurs. Il s'agit actuellement d'une technologie expérimentale, mais déjà disponible dans la plupart des navigateurs (sauf c.-à-ÉCon).

de MDN Web Docs

La méthode chèque () de la FontFaceset retourne si toutes les polices de la liste de polices données ont été chargées et sont disponibles.

Exemple: xxx

Lorsque vous utilisez le CHECK () Méthode, assurez-vous de vérifier si les opérations de chargement des polices ont été complétées en utilisant le prêt propriété, qui retourne un prometteur lorsque le chargement a terminé: xxx


1 commentaires

Malheureusement, cela ne fonctionne pas sur iOS. Vérifié et double vérifié. J'ai déposé un rapport en tant que tel sur la page GITUB respective de MDN.