|
17. květen 2000 - Tipy a triky |
HTML Tip č. 22: Jak změnit obrázkový odkaz při přechodu kurzorem
Jistě jste se již setkali se stránkami, kde bylo navigační menu řešeno pomocí obrázků, které se při najetí myší měnily (typicky například tlačítka, jež měnila barvu nebo se různě deformovala). Jak na to si ukážeme v dnešním již 22 triku pro webmastery.
- Připravte si podobu obrázku jak bude vypadat v okamžiku, kdy bude návštěvník kurzorem myši mimo a nad ním. V našem příkladu jsme si vytvořili dva soubory nazvané kurzornad.gif a kurzormimo.gif.
- Za hlavičku stránky (tj. za tag </HEAD> a před tag <BODT>) vložte následující kód:
<script language="javascript">
<!--
aktivni = new Image;
aktivni.src = "kurzornad.gif";
neaktivni = new Image;
neaktivni.src = "kurzormimo.gif";
//-->
</script>
- Do místa, kam budete chtít umístit obrázek vložte následující kód:
<a href="odkaz.htm" onMouseOver="neaktivni.src=aktivni.src; return true" onMouseOut="neaktivni.src='kurzormimo.gif'">
<img name="neaktivni" src="kurzormimo.gif" width=šířka_obrázku height=výška_obrázku border=0></a>
Jak vidíte, je to velmi snadné. |
|
 |
Reklama |
Zde může být vaše reklama.
|
 |
|
|
 |
Reklama |
|
|