Discussion :

[Kikkoman]

Bonjour à tous,
après quelques recherches effectuées grâce à mon ami google, je me tourne vers vous car je n'ai vraiment aucune idée pour résoudre mon problème.

J'aimerais savoir s'il est possible de détecter si une certaine police d'écriture est installée sur le poste client. Pour des raisons que je ne développerais pas ici, il faut que la police d'écriture soit obligatoirement installée sur le poste client, sinon l'utilisateur est priée de l'installer.

Quelqu'un aurait-il une idée lumineuse?

[SpaceFrog]

attribue la police au style d'un element et essaye de récupérer le Computedstyle ?

[Kikkoman]

tout d'abord, merci pour ta réponse.
J'ai essayé ta solution sur un code tout basique que voici :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<div id="div1" style="background-color:#CCCCCC; font-family:TEST, Bodega, Impact, Arial, Helvetica, sans-serif;" onclick="getFont()">Div de test</div>
<script language="javascript">
function getFont() {
	var oDiv = document.getElementById("div1");
	alert(document.defaultView.getComputedStyle(oDiv, null).fontFamily);
}
</script>

Mais il me retourne "TEST, Bodega, Impact, Arial, Helvetica, sans-serif" c'est-à-dire toutes les polices même celles qui n'ont pas fonctionné snif...

Je ne connais pas vraiment la methode computedStyle, peut-être que je l'ai mal utilisée?

[RomainVALERI]

document.defaultView.getComputedStyle ? je crois que c'est une implémentation du DOM niv 2, mais peut-être que ce n'est pas reconnu par certains navigateurs ? (à vérifier)

Sinon essaie peut-être aussi window.getComputedStyle

[Kikkoman]

document.defaultView.getComputedStyle ? je crois que c'est une implémentation du DOM niv 2, mais peut-être que ce n'est pas reconnu par certains navigateurs ? (à vérifier)

Sinon essaie peut-être aussi window.getComputedStyle

Même résultat, il m'affiche toutes les polices notées dans le style et non pas celle utilisée. (d'ailleurs les 2 solutions fonctionnent sur FF mais pas sur IE, mais bon ça ce n'est pas encore trop grave)

[SpaceFrog]

http://www.developpez.net/forums/d49...-currentstyle/

[Kikkoman]

http://www.developpez.net/forums/d49...-currentstyle/

Je viens de tester le code du post que tu as pointé avec ton lien, il affiche exactement la même chose que les précédents, c'est-à-dire les polices écrites en CSS mais pas celle utilisée au final.
En fait, mon CSS contenant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

font-family:TEST, Bodega, Impact, Arial, Helvetica, sans-serif;

le code affiche "TEST, Bodega, Impact, Arial, Helvetica, sans-serif"
Mais cela ne résoud pas mon problème car je voudrais qu'il affiche la police réellement utilisée, c'est-à-dire Impact dans mon cas, car il ne trouve ni TEST, ni la police Bodega.

Je ne sais pas si je me suis bien expliqué
A priori c'est impossible avec la methode computedStyle vu que le code source lui-même affiche toutes les polices, mêmes celles inexistantes.

[SpaceFrog]

non pour savoir si une police est installée je tentais la ruse suivante :

tu imposes une seule police dans un style et tu recupère ensuite le computedStyle ...
si la police est installée tu devrais recupérere le nom de la police;
sinon tu récupèrerais le nom de la police par defaut

[Kikkoman]

non pour savoir si une police est installée je tentais la ruse suivante :

tu imposes une seule police dans un style et tu recupère ensuite le computedStyle ...
si la police est installée tu devrais recupérere le nom de la police;
sinon tu récupèrerais le nom de la police par defaut

Ok je comprend mieux!
Sauf que ça ne fonctionne pas non plus avec une seule police, il récupère tout de même la police écrite dans le CSS, même si celle ci n'est pas installée ou est erronée.
Dommage ça aurait été nickel...

[marcha]

Salut,

J'espère qu'il existe une solution simple à ton problème... mais
au pire, voici une piste:

Tu pourrais mesurer le rapport largeur hauteur d'un certains nombre
de lettres de la police que tu attends. Puis comparer avec la police
effectivement utilisée.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<script type='text/javascript'>
 
function calculFontSignature(font) {
	var chars = "ABCDEFGHIabcdefghi0123:;";
	var test = document.createElement('div');
	//test.style.visibility = 'hidden';
	test.style.position = 'absolute';
	test.style.fontFamily = font; 
	document.body.appendChild(test);
	var dims = [];
	for(var i=0;i<chars.length;i++) {
		test.innerHTML = chars.charAt(i);
		var d = Math.floor(test.clientWidth/test.clientHeight*100);
		dims.push(d);
	}
	document.body.removeChild(test);
	return dims.join(',');
}
 
document.write( calculFontSignature("Serif") );
document.write("<br />");
document.write( calculFontSignature("Georgia") );
document.write("<br />");
document.write( calculFontSignature("monospace") );
document.write("<br />");
</script>
</body> 
</html>

Si d'aventure tu devais utiliser une telle solution, méfiance avec
l'agrandissement des texte (zoom texte du navigateur) il faudrait
peut-être faire une signature par taille... à voir.

[Kikkoman]

Je crois que je n'aurais jamais imaginé contourner le problème comme cela ^^
Mais oui effectivement c'est une piste, ce n'est pas une solution très "élégante" mais c'est carrément mieux que rien, merci!
Je vais donc regarder ta solution de + près et je te dis ce qu'il en est
(merci aussi pour les conseils sur l'agrandissement du texte, je n'y aurais pas pensé non plus)