11548 sujets

JavaScript, DOM et API Web HTML5

Bonsoir à tous !! Smiley biggrin

Voilà je souhaiterais réaliser un script javascript qui en cliquant sur des boutons pouvoir augmenter ou diminuer la taille de la police .

Si quelqu'un connaît un tutorial ou à un début de réponse merci d'avance, car j'avoue ne pas être trés à l'aise avec le js !!
Modifié par bibine (21 Apr 2006 - 13:06)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>...</title>

<style type="text/css">

#texte {
font-size:10px;
}

</style>

<script type="text/javascript">

var taille=10;
var num;

function change(t,p){
	if(taille>8){
		if(p=="moins"){
			taille--
		 }
	};
	if(taille<50){
		if(p=="plus"){
			taille++
		 }
	};
	
	t.style.fontSize=taille+"px";
	num=t.firstChild.data.replace(/\d+px/,t.style.fontSize);
	t.firstChild.data=num;
}

</script>

</head>
<body>

<p id="texte">Texte avec une police de 10px.</p>

<div id="cadre">

<input type="button" value="diminuer" onclick="change(document.getElementById('texte'),'moins')" /> 
<input type="button" value="agrandir" onclick="change(document.getElementById('texte'),'plus')" /> 

</div>

</body>
</html>
Bonjour, tu peux utiliser ce code simple pour modifier la taille de police de la page entière :

<script type="text/javascript">
x=document.body.style;n=1;x.fontSize=1+'em'</script>
<input type="button" onclick="n+=.1;x.fontSize=n+'em'" value="taille +" />
<input type="button" onclick="n-=.1;x.fontSize=n+'em'" value="taille -" />

Bizarement, IE ne modifie pas la taille des titres (h1,h2 ...)
Modifié par chmel (20 Apr 2006 - 07:18)