Taillefonte

Contenu du snippet

Changer la taille du texte sans recharger la page.

Utilisation :
<span onClick="tailleFonte('+');"> Augmenter </span>
<span onClick="tailleFonte(0);"> Rétablir </span>
<span onClick="tailleFonte('-');"> Diminuer </span>

Pour voir en temps réel : www.virtuacom.fr.

Source / Exemple :


// 
// Tiger-222, Mai 2009.
// 
// Description :
//	Changer la taille du texte sans recharger la page.
//
// Utilisation :
// 	<span onClick="tailleFonte('+');"> Augmenter </span>
//	<span onClick="tailleFonte(0);"> Rétablir </span>
//	<span onClick="tailleFonte('-');"> Diminuer </span>
//
function tailleFonte(modif)
{
	var reset 	= 11;	// Taille par défaut
	var min 	= 8;	// Taille minimale
	var max 	= 16;	// Taille maximale
	var actuelle 	= 0;	// Taille actuelle
	var nouvelle 	= 0;	// Nouvelle taille
	
	// Récupération de la taille actuelle :
	if ( window.getComputedStyle )
	{ 
		actuelle = window.getComputedStyle(document.body,null).fontSize;
	}
	else
	{
		actuelle = document.body.currentStyle.fontSize;
	}
	
	// Suppression du suffixe 'px' :
	actuelle = actuelle.substring(0, (actuelle.length - 2));
	
	// Détermination de la nouvelle taille :
	if ( modif === 0 && actuelle !== reset )
	{
		document.getElementsByTagName('body')[0].style.fontSize = reset + 'px';
	}
	else if ( modif == '+' && actuelle < max && actuelle !== reset )
	{
		nouvelle = new Number(actuelle) + 1;
		document.getElementsByTagName('body')[0].style.fontSize = nouvelle + 'px';
	}
	else if ( modif == '-' && actuelle > min && actuelle !== reset )
	{
		nouvelle = new Number(actuelle) - 1;
		document.getElementsByTagName('body')[0].style.fontSize = nouvelle + 'px';
	}
}

Conclusion :


C'est simple mais efficace et le code fonctionne aussi sous IE.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.