Quarto tutorial per immagini in un documento - matematica con javascript su webfract

Contatti	MATEMATICA CON JAVASCRIPT TUTORIAL PER L'ASPETTO DI UN DOCUMENTO - 4 Precedente

Il presente tutorial si riferisce a oggetto document - pagina 1 della guida a MATEMATICA CON JAVASCRIPT.

Abbiamo preparato un documento che ha l'aspetto definito dalle righe di codice inserite nell'area di testo in basso a sinistra (CODICE).

In particolare abbiamo messo in evidenza come, con gli opportuni comandi, si possa sia accedere alle proprietà delle immagini, sia cambiarle.

E' possibile modificare il codice e quindi vedere l'anteprima cliccando sul tasto:

A LATO per osservare il risultato nell' iframe a destra nella pagina;
POPUP per osservare il risultato in una finestra popup

NOTA BENE - Gli utenti google chrome possono solo visualizzare il risultato in una popup, a causa del malfunzionamento del browser con gli iframe.

Infine, cliccando sul tasto AGGIORNA, viene ricaricata la pagina corrente come è adesso:

CODICE

RISULTATO

<HTML>
<p align=center>
<img src ="T1.gif"  id = "papera" width=114 height=80>
<img src ="T2.gif" id="gatto">
<img src ="T5.gif" id="oca">
</p>
<p><input type='button' value="Aggiungi il bordo" OnClick="document.images[0].border='1';document.images[1].border='1';document.images[2].border='1';"> <input type='button' value="Togli il bordo" OnClick="document.images[0].border='0';document.images[1].border='0';document.images[2].border='0';">
</p>
<script language=JavaScript>
document.write('<br>Le immagini sono in numero di  ' + document.images.length);
document.write('<br>La larghezza della prima immagine è di ' + document.images[0].width + ' pixel');
document.write('<br>L\'altezza della prima immagine è di ' + document.images[0].height + ' pixel');
document.write('<br>La prima immagine ha come id ' + document.images[0].id);
document.write('<br>La prima immagine ha come URL<br> ' + document.images[0].src);
document.write('</p><p>La prossima è un\'immagine con effetto ONMOUSEOVER. PROVA!<p>');
document.write('<IMG SRC="T2.gif" id="face"  ONMOUSEOVER="document.images[\'face\'].src=\'T2.png\'" ONMOUSEOUT="document.images[\'face\'].src=\'T2.gif\'">')
</script>
</BODY>
</HTML>

ANTEPRIMA:

INDICE ASPETTO DI UN DOCUMENTO - TUTORIAL 1 - 2 - 3 - 4

MATEMATICA CON JAVASCRIPT

TUTORIAL PER L'ASPETTO DI UN DOCUMENTO - 4

CODICE

RISULTATO