Jak zrobić, aby jeden obrazek zmienił się w drugi po najechaniu na niego myszka? W zasadzie ten skrypt nie jest aż tak skomplikowany, jak mogłoby się wydawać. Musimy stworzyć jedną prostą funkcję w JavaScript, a następnie odpowiednio się do niej odwołać: Tak więc w sekcji <head> zadeklarujemy ową funkcję:
Sekcja <head>:
<script language="javascript">
<!--
function zmien(nazwa, url)
{
document[nazwa].src=url;
}
// -->
</script> |
A teraz wywołamy skrypt odpowiednimi poleceniami (to oczywiście robimy już w sekcji <body>):
<a href="http://webcity.pl" onmouseover="zmien('nazwa_obrazka','2.gif')" onmouseout="zmien('nazwa_obrazka','1.gif')">
<img src="1.gif" border="0" name="nazwa_obrazka"></a> |
Nasza funkcja została wywołana dwa razy pod danym warunkiem (onMouseOver, onMouseOut). Są to wbudowane funkcje JavaScript, które pozwalają wykonaś jakąś część kodu odpowiednio pod warunkiem najechania na jakiś obiekt myszką i zjechania z niego. Każdy obrazek musi posiadać swoją nazwę określoną za pomocą HTML-owskiego znacznika
name w tagu
<img>, bez tego JavaScript nie uzna naszego obrazka za obiekt i nieprawidłowo wykona funkcje over() i out().