KOMPOOS.NL

onmouseover - HTML5

home » manuals » html5 » onmouseover.html

sitemap | terug naar het html5 referentie - events - overzicht

voorbeeld van het onmouseover event

onmouseover

uitleg mouseover event

Het is veel makkelijker om een afbeelding met CSS een hover te geven als er bij een mouseover iets aan de style verandert moet worden. In alle overige gevallen kan je de onmouseover event gebruiken (die dan gelijk javascript noodzakelijk maakt om alles goed te laten functioneren). Hieronder staat de regel code die gebruikt is om het plaatje op deze pagina van het onmouseover "gebeuren" te voorzien, en daar weer onder staat het stukje javascript wat de border maakt. In plaats van de border-code kan je natuurlijk elke (javascript)procedure uitvoeren die je maar wilt.

Deze pagina geldt gelijk voor het onmouseout event.
<img onmouseover="_onmouseover(this)" onmouseout="_onmouseout(this)" src="onmouseover.jpg" />

het javascript(je) voor het onmouseover event


<script>
        function _onmouseover (elem) {
                elem.style.borderLeft = "4px solid orange";
        }
        function _onmouseout (elem) {
                elem.style.border = "";
        }
</script>