A webfejlesztés netovábbja. :)
-
#103
"hogy ha fölé megyek az egérrel egy másik területen egy rejtett rétegen láthatóvá válik 1 általam készített rövid kis animáció"
Tehát ha jól értem (eléggé szabadszavasan fogalmaztál), van egy "gombod", vagyis egy képed (<img src="gomb.jpg" alt="Gomb" />), ha erre rámész, akkor egy másik "rétegen" (remélem nem a <layer> tagre gondolsz - az elavult, ellenjavallt, nem platformfüggetlen; hanem egy táblázatcellát - <td> - vagy inkább egy <div> elemet), akkor a másik rétegben megjelenik az animáció.
Tehát tegyük fel, hogy az alábbi HTML-struktúrád van:
<img src="gomb.jpg" alt="Gomb" id="gomb" />
<div id="anim">
</div>
Ehhez az alábbi Javascript kód dukál:
<script type="text/javascript">
document.getElementById('gomb').onmouseover = function() {
document.getElementById('anim').innerHTML = '<img src=\"anim.gif\" alt=\"Animáció\" />';
}
document.getElementById('gomb').onmouseout = function() {
document.getElementById('anim').innerHTML = '';
}
</script>
Hogyan működik? Ha egérrel rámész a képre, bekövetkezik az onmouseover esemény.
Az onmouseover esemény bekövetkeztekor lefut egy Javascript-függvény, ami az anim id-jú elem belsejébe berakja az animáció - jelen esetben egy animált gifet.
Vagyis így fog kinézni az anim id-jú elem a függvény lefutásakor:
<div id="anim">
<img src="anim.gif" alt="Animáció" />
</div>
Ha egérrel elhagyod a gomb területét (onmouseout esemény), akkor a másik függvény fut le, ami üres tartalmat rak az anim id-jú elem belsejébe:
<div id="anim">
</div>