Cambio dimensione carattere con un click

Printable View

19-02-2007, 16.29.15
devlabs

Cambio dimensione carattere con un click

Salve..
Vorrei dei consigli per come implementare nel mio sito due pulsanti che mi facciano rispettivamente ingrandire la grandezza del font nella pagina e un'altro che mi faccia tornare la grandezza esattamente come prima. Magari qualcosa che includa anche qualche effetto Javascript così da rendere il cambio font più "piacevole".
In pratica l'effetto che vorrei è lo stesso già presente nella pagina www.mad4milk.net

Io avevo già fatto in modo che il font cambiasse senza effetti particolari ma il JS non funziona su firefox...
Avevo usato questo codice:

Codice:

function ImpostaFontSize(dimensione) { document.getElementById('content').style.fontSize = dimensione; }

E poi lo richiamavo nella pagina con un semplice:

Codice:

<a href="java-script:ImpostaFontSize(12)">Cambia carattere</a>

Ho postato anche lo javascript semplice che non funziona con firefox per pura curiosità così capisco cosa avrei dovuto cambiare ma naturalmente preferisco un effetto più "simpatico" come quello di mad4milk...

Grazie
Bye
19-02-2007, 16.51.36

prova con <a href="#" onclick="javascript:ImpostaFontSize(12);">Cambia carattere</a>
19-02-2007, 16.57.57
devlabs

Citazione:

Originalmente inviato da walrus

prova con <a href="#" onclick="javascript:ImpostaFontSize(12);">Cambia carattere</a>

L'idea era buona ma continua a non funzionare... Come sempre su IE tutto a posto e problemi con Firefox..
19-02-2007, 17.08.01

A me funziona correttamente e ho fatto una stupidissima pagina html:

Codice HTML:

<html> <head> <script language="javascript"> function ImpostaFontSize(dimensione) { document.getElementById('content').style.fontSize = dimensione; } </script> </head> <body> <div id="content"> asdasdasdas </div> <a href="#" onclick="javascript:ImpostaFontSize(12);">Cambia carattere</a> </body> </html>
19-02-2007, 17.20.41
devlabs

Il tuo codice in effetti funziona ma non trovo nessun errore nel mio! Infatti funziona perfettamente su IE...

Provare per credere: http://www.devlabs.it/beta.php
19-02-2007, 17.34.49

mmh è strano... non è che hai impostato la dimensione del font nel css?

comunque un debugger per js in firefox mi dice che c'è un problena con la funzione init() all'interno della pagina...
19-02-2007, 17.51.10

Conflitto di JS.. :sisi:
19-02-2007, 18.39.30
devlabs

No no... Anche io ho il debugger in firefox... E non da nessun errore... L'errore lo da nella pagina che vi ho dato io perchè avevo tolto tutti gli altri javascript per evitare di appesantire la pagina...
Adesso ho tolto tutto perfettamente infatti non ci sono più errori ma lo script continua a non funzionare
20-02-2007, 10.18.20
funcool

Prova a modificare la riga della funzione in questo modo:

Codice:

document.getElementById('content').style.fontSize = dimensione+"pt";
20-02-2007, 12.04.19
devlabs

Citazione:

Originalmente inviato da funcool

Prova a modificare la riga della funzione in questo modo:

Codice:

document.getElementById('content').style.fontSize = dimensione+"pt";

Funziona! :eek:
Grazie mille... Conoscete un modo per rendere il cambio font più "fluido" magari implementando ajax? Un pò come succede con mad4milk...
20-02-2007, 12.13.17
funcool

Viene utilizzata la libreria Moo.fx.
20-02-2007, 14.28.15
devlabs

Come? E poi perchè con lo script che sto usando fino ad ora i link non cambiano fontsize?
20-02-2007, 19.33.30
funcool

Per avere lo stesso effetto devi scaricare la libreria Moo.fx e studiarti un po' la documentazione.
Per cambiare la grandezza del carattere per tutto il sito prova a fare così:

Codice:

document.body.style.fontSize = dimensione+"pt";
21-02-2007, 15.22.17
devlabs

Citazione:

Originalmente inviato da funcool

Per avere lo stesso effetto devi scaricare la libreria Moo.fx e studiarti un po' la documentazione.
Per cambiare la grandezza del carattere per tutto il sito prova a fare così:

Codice:

document.body.style.fontSize = dimensione+"pt";

Anche facendo così i link continuano a rimanere sempre della stessa grandezza...

EDIT: Up... Come mai il carattere dei link non diventa più grande? Help

FunCool: Non scrivere due messaggi consecutivi, utilizza il tasto Edita.