1. Vyrobte originální animovaný GIF
Animovaný rolover se skládá z pozadí animace
a animovaného GIFu
. Můžete vyrobit
také cyklickou animaci.
2. Vytvořte JavaScript rolover efekt
Do hlavičky www stránky napište obdobný kód JavaScriptu:
< SCRIPT language="JavaScript"> //< !- if (document.images){ imgoff=new Image(); imgoff.src="pozadí_animace.gif" imgon=new Image(); imgon.src="animovaný.gif" } function On(){ if (document.images){ document['jméno_obrázku'].src=imgon.src; } } function Off(){ if (document.images){ document['jméno_obrázku'].src=imgoff.src; } } //-> < /SCRIPT>
3. Použijte Java Script v odkazu < A HREF= ...>
< A HREF= ... onMouseOver="On();status='Text ve st. ř.'; return true" onMouseOut="Off();status=''"> < IMG name="jméno_obrázku" width=šířka_obrázku height=výška_obrázku src="pozadí_animace.gif" border=0> Text nebo obrázek odkazu< /A>Příklad - vytvoření animovaného roloveru ze začátku této stránky:
V hlavičce: < SCRIPT language="JavaScript"> //< !- if (document.images){ imgoff=new Image(); imgoff.src="zajic1.gif" imgon=new Image(); imgon.src="zajicani.gif" } function On(){ if (document.images){ document['anim'].src = imgon.src; } } function Off(){ if (document.images){ document['anim'].src =imgoff.src; } } //-> < /SCRIPT> V odkazu: < A HREF="prac18.htm" onMouseOver="On();status='Tvorba roloverů'; return true" onMouseOut="Off();status=''"> < IMG name="anim" width=50 height=50 src="zajic1.gif" border=0> roloverům< /A>Začátek