Funzione per ingrandire dinamicamente tutti i caratteri della pagina

Per aumentare l'accessibilità del sito ho deciso di implementare una funzione che, attraverso dei tasti, ingrandisca tutti i caratteri della pagina...

Ho trovato questa funzione in giro, e vorrei modificarla:

Codice HTML:

---

<script
function setFontSize(value) {
        theStyle = null;
        if (value == "small") theStyle        = "100%";
        if (value == "medium") theStyle        = "110%";
        if (value == "large") theStyle        = "125%";
        if (theStyle)
                document.getElementsByTagName("body")[0].style.fontSize = theStyle;
}
</script>

---

Questo codice è da inserire nella head della pagina. Nel corpo della pagina mi basta richiamare attraverso un link la funzione setFontSize(large) per aumentare la dimensione dei caratteri..

La funzione è ok e i caratteri si ingrandiscono..

Il fatto è che i caratteri della pagina NON sono tutti della stessa dimensione. richiamando quella funzione TUTTI i caratteri della pagina, qualunque sia la loro dimensione, vengono ingranditi TUTTI al livello 100%, 110% o 125%.

I vorrei fare in modo che la funzione riconosca la dimensione dei caratteri e li ingrandisca in maniera relativa... Non so se mi sono spiegato..

So che potrei risolvere il problema creando piu fogli di stile alternativi e richiamando i fogli di stile... Ma così sarebbe decisamente meglio..

Come potrei ristrutturare quella funzione per fare quello che mi serve?..

Prova a fare così:

Codice:

---

document.getElementsByTagName("body")[0].style.fontSize += theStyle;

---

Però credo che i valori che assegni a theStyle debbano essere un numero e non una percentuale.

Nulla da fare... Ho provato a impostare anche un numero ed a fare quella modifica.. non va...

In realtà quello che penso ci voglia è cambiare totalmente la funzione...

usando il document.getElementsByTagName("body")[0].style.fontSize penso che si possa soltanto impostare una e una sola dimensione di carattere per tutto il body.

Quello che in realtà ci vorrebbe, secondo me, è una sorta di ciclo for, che modifica lo stile dei tag della pagina uno ad uno.. leggendo e aumentando di un certo valore ogni singolo elemento, ma non so se la cosa è fattibile... Tra l'altro è abbastanza strano che non abbia trovato nulla di gia pronto in rete...

Citazione:

---

Originalmente inviato da attorianzo

Tra l'altro è abbastanza strano che non abbia trovato nulla di gia pronto in rete...

---

chi cerca trova, vedi qui: http://constile.org/DHTML/ridimensionare_i_caratteri/

Citazione:

---

Originalmente inviato da bfi

chi cerca trova, vedi qui: http://constile.org/DHTML/ridimensionare_i_caratteri/

---

Quello che hai segnalato fa la stessa cosa di quello già scritto da Attorianzo.

se guardi l'esempio ( http://constile.org/DHTML/ridimensio...caratteri.html ) ti accorgi che non è vero, infatti le dimensioni vengono aumentate in relazione con la vecchia dimensione :).
Una cosa da notare è che nella pagina d'esempio viene utilizzata un unità di misura, em. ( http://constile.org/tutorial/come_di...e_i_caratteri/ ) Studia questo e saprai come adottarla
ciao!

Citazione:

---

Originalmente inviato da domenicoragusa

se guardi l'esempio ( http://constile.org/DHTML/ridimensio...caratteri.html ) ti accorgi che non è vero, infatti le dimensioni vengono aumentate in relazione con la vecchia dimensione :).

---

Hai ragione, ma non riesco a trovare differenze nel codice Javascript.

infatti non c'è, cambia l'unità di misura, prova quello script utilizzando nei css px e poi em ;)
Ciao!

Citazione:

---

Originalmente inviato da domenicoragusa

infatti non c'è, cambia l'unità di misura, prova quello script utilizzando nei css px e poi em ;)

---

Credevo che dopo il mio primo messaggio Attorianzo l'avesse già fatto...

Ho provato questo script suggerito.. E' effettivamente identico a quello che avevo trovato io solo che è spiegato passo passo.

Ora funziona a dovere :) Potete dargli un'occhiata se volete è implementato nella home del sito adesso.

Grazie a tutti :)