New Page 3

Volanie zmeny obrázka odkazom

<html>

<head>

if(document.images){

h1=new Image

h2=new Image

h1.src="h1.gif"

h2.src="h2.gif"

}

else {

h1=""

h2=""

document.hodiny=""

}

</script>

</head>

<p><a onmouseover="document.hodiny.src=h2.src" onmouseout="document.hodiny.src=h1.src">ukážka</a><img border="0" src="h1.gif" name="hodiny" width="85" height="75"></p>

ukážka

V tomto prípade chceme meniť obrázok pri nájazde myšou nad určitý text - napr. pri vymenovaní určitých produktov sa nám v okienku tieto objavujú podľa toho na aký názov sme práve ukázali myšou.

V tomto prípade uzavrieme text (v našom prípade ukážka ) do kontajnera

<a onmouseover...>ukážka </a>

Príklad: Vytvorte miesto pre obrázok a textovú časť s menami miest. Nájazdom myši nad meno mesta sa v priestore pre obrázok objaví fotografia príslušného mesta.

Nitra

Kosice

Trencin

Ako v predchádzajúcich príkladoch natiahneme obrázky do prehliadača - tento skript vložíme do hlavičky stránky.
V časti <body> vložíme obrázok s názvom "mesto"<img border="0" src="prazdne.jpg" name="mesto" width="100" height="141">
Do názvov jednotlivých miest vložíme odkaz na príslušnú fotografiu mesta - napríklad <a onmouseover="document.mesto.src = Nitra.src" onmouseout="document.mesto.src = prazdne.src ">Nitra</a>

Zdrojový kód:

Nitra=new Image

Trencin=new Image

Kosice=new Image

prazdne=new Image

Nitra.src="Nitra.jpg"

Trencin.src="Trencin.jpg"

Kosice.src="Kosice.jpg"

prazdne.src="prazdne.jpg"

}

else {

Kosice=""

Nitra=""

Trencin=""

document.mesto=""

}

</script>

<body>

<a onmouseover="document.mesto.src = Nitra.src" onmouseout="document.mesto.src = prazdne.src ">Nitra</a>

<p><a onmouseover="document.mesto.src = Kosice.src" onmouseout="document.mesto.src = prazdne.src ">Kosice</a></p>

<a onmouseover="document.mesto.src = Trencin.src" onmouseout="document.mesto.src = prazdne.src ">Trencin</a>

</td><td>

</td></tr></table>

</div>

</body>