onmouseover is not defined, error, ¿Dónde podría estar el error?

[AngelMarine]

<div id="bar-transition">
<script type="text/javascript">
function menu-iluminate-over() {
document.getElementById("menu-bar").src="menu-light.png";
}
function menu-iluminate-out() {
document.getElementById("menu-bar").src="menu.png";
}
</script>
<img id="menu-bar" src="menu.png" title="Categorías" onmouseover="menu-iluminate-over()" onmouseout="menu-iluminate-out()" style="
cursor: pointer;
float: left;
position: absolute;
top: 12px;
left: 100px;
">
</div>

[Alexis88]

Parece ser que es por los guiones, reemplázalos por guiones bajos o escribe el nombre en estilo Camel Case, por ejemplo, en lugar de "menu-iluminate-out", coloca "menuIluminateOut".

Realicé el cambio que te sugiero y así quedó: http://jsbin.com/OsIDoVaF/1

Saludos

[AngelMarine]

mmm..., ya lo he intentado y sigue sin funcionar.

[carbon]

He hecho un par de cosas en JS pero yo no conozco ningun lenguaje que permita nombrar funciones con guiones altos. Definitivamente reemplazalos por guiones bajos o quitaselos.

[Alexis88]

Iniciado por AngelMarine

mmm..., ya lo he intentado y sigue sin funcionar.

Cambia los guiones de los nombres de las funciones por guiones bajos tanto en las mismas funciones como en las llamadas que haces, es decir, en los atributos onmouseover y onmouseout del elemento img.

Saludos