begin process at 2010 08 01 01:13:42
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Navigation

 > TAILLEFONTE

TAILLEFONTE


 Description

Cliquez pour voir la capture en taille normale
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

  • //
  • // 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';
  • }
  • }
// 
// 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.


 Sources de la même categorie

Source avec Zip Source avec une capture NAVIGATION PAR AJAX, CHARGEMENT DES PAGES SANS RECHARGEMENT par zulrigh
Source avec Zip Source avec une capture MENU DE GAUCHE WIN XP par micking
Source avec Zip ARBORECENCE XP DRAG-ON-DROP par micking
Source avec Zip MARQUEE VERSION2 COMPATIBLE MOOTOOLS, JQUERY, PROTOTYPE ET S... par Kimjoa
Source avec Zip EMULATION DE $_GET() DU PHP par jchan

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture NAVIGATION PAR AJAX, CHARGEMENT DES PAGES SANS RECHARGEMENT par zulrigh
Source avec Zip Source avec une capture PAGES EFFET MOBILE TACTILE... par sitajony
Source avec Zip ACCESSIBARRE - AMÉLIORER LE CONFORT DES PERSONNES NON-VOYANT... par Pfuch
Source avec Zip TBFRAME: TAB BROWSING FRAME par triumphs
Source avec Zip Source avec une capture SCROLL BAR PERSONALISE par kazma

Commentaires et avis

Commentaire de kankrelune le 25/06/2009 20:46:34

Uhm... menu du navigateur > affichage > taille du texte ou zoom... .. .

@ tchaOo)

Commentaire de tiger222 le 26/06/2009 17:37:08

Merci ;)

Ça pourra toujours être utile quand même.

Commentaire de yohan90 le 29/06/2009 18:00:00

Merci pour ce code,
il est prévu pour etre intégré dans le header des page ou peut etre mis ds un fichier js tel quel ?

Commentaire de tiger222 le 29/06/2009 18:09:07

Comme tu le sens, tu peux copier/coller ce code dans un fichier .js ou directement dans le header, ça fonctionnera pareil.

Perso je l'utilise dans un .js pour l'intégrér facilement dans toutes mes pages, et par soucis de facilité surtout parce que si je veux modifier le code, mieux vaut qu'il soit dans un .js pour ne pas avoir à modifier manuellement toutes les pages où il est inclus.

Commentaire de yohan90 le 29/06/2009 19:07:11

Merci !

Commentaire de Johniquito le 15/07/2009 08:59:16

Bonjour,

Merci pour ce script sympa, mais est-ce que ça marche avec des i-frames ? J'ai un peu de mal à le faire fonctionner.

Merci d'avance pour la réponse :)

Commentaire de tiger222 le 15/07/2009 17:17:26

Tente voir de remplacer document par le nom d ton iframe peut être...

Commentaire de Johniquito le 17/07/2009 11:27:14

Bonjour,

Merci pour ta réponse, j'ai essayé avec ton idée mais ça ne veut pas bouger :/

C'est dommage, mais merci quand même, j'utiliserai ton script dans d'autres pages quand les i-Frames ne seront plus nécessaires.

Commentaire de crabman le 04/05/2010 14:43:21

Merci pour ce code, j'ai eu un de ces mal à trouver un script efficace et complet.
Merci encore ;)

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

**Personnaliser la police et la taille du texte d'un menu** [ par gprog ] BonjourAvant tout je dois dire que je suis novice en langage javascript.J'utilise un menu javascript que je souhaiterais modifier au niveau des police accelerer et changer la taille et la police des blaises alt [ par ganesh1974 ] Voila tout est dans le titre, est ce qu'il possible d'accélerer l'affichage d'une balise alt.Est il egalement possible de modifier la police (taille e Taille de police [ par biskbart ] Bonjour, je souhaiterais savoir si c'est possible pour une police &#224; largeur non constante de connaitre la longueur de la chaine en pixel. J'ai ch Calculer la taille d'un texte [ par Utano ] Bonjour, Je cherche à calculer la taille d'un texte (hauteur et surtout largeur) en fonction de la police donnée, de la taille de la police (en cm) hauteur de police [ par inaden ] Bonjour,y a-t-il à votre connaissance le moyen de changer la largeur d'une police via CSS. Pas sa taille, mais sa largeur pour une taille donnée.Merci Taille police javascript [ par bernard26000 ] Bonjour a tousje fais un programme ou le visiteur peut avoir la possibilité de mettre un texte sur une image, d'en modifier la police, la taille de la [HTML]changement de taille de police [ par amateurjava ] Bonjour, bizarerie sur un reseau (1 serveur et 20 postes): j'ai crée un intranet pour une société. Concernant un div particulier j'ai donné un attrib Probleme de taille de police [ par amateurjava ] Bonjour, bizarerie sur un reseau (1 serveur et 20 postes): j'ai crée un intranet pour une société. Concernant un div particulier j'ai donné un attrib Taille de police [ par elpens ] Bonjour,J'ai un problème au niveau du design...J'ai un fichier CSS qui me permet d'afficher mon text du body a 70% de la taille réelle. Le problème, e Taille d'un curseur en CSS [ par psylo66 ] Bonjour, voila ca fait un petit moment  je cherche a changer la taille du curseur en CSS.j'ai réussit à changer l'image de mon curseur via cette ligne


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Août 2010
LMMJVSD
      1
2345678
9101112131415
16171819202122
23242526272829
3031     

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,718 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales