Il miglioramento delle tecniche di interfacciamento tra HTML e i linguaggi di scripting come Javascript permette alle versioni più recenti dei browsers più diffusi di visualizzare pagine Web contenenti effetti di animazione prima realizzabili solo con gif animate, applet Java o software specializzato.
Queste tecniche di animazione si basano fondamentalmente sull'uso del marcatore HTML canvas e del metodo setinterval dell'oggetto Window.
Il seguente esempio propone una semplice applicazione di queste tecniche: la pagina HTML mostra una stringa le cui dimensioni prima
aumentano e poi diminuiscono. La stringa viene 'disegnata' nel supporto grafico canvas.
Dopo 50 millisecondi canvas viene annerito e la stringa viene riprodotta in dimensione leggermente aumentata
nella prima fase o diminuita nella seconda fase.
Il sorgente HTML dell'esempio si può vedere cliccando il seguente bottone.
Il contenuto del file zoominout.js, richiamato nel sorgente dell'esempio è visibile cliccando il seguente bottone seguente.
Le funzioni Javascript realizzano l'animazione con l'uso del metodo
window.setInterval("funzione_da_eseguire()",
ogni quanti ms).
Questo metodo crea un timer in millisecondi,
da assegnare ad una opportuna variabile (ad es. timer), che esegue la funzione indicata
(nell'esempio, la funzione cambia le dimensioni dei caratteri) ogni tot millisecondi.
Per fermare il timer si usa il metodo window.clearInterval(timer).