Hola a todos,
estoy empezando a utilizar javascript y necesitaría ayuda para desarrollar una simple function.
Me explico quería aplicar a un <a> una function que al event "onMouseOut" quite poco a poco el color de a:hover que le había dado con otra function....de manera que se vea la barrita de color que va decreciendo hasta volver al color de <a> antes de haber pasado el ratón encima.
Pido perdona pero me resulta dificil hasta explicaros el problema.
Os dejo aquí el código que he ententado escribir y que no funciona!
Gracias de antemano a quien sabrá ayudarme!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prova-portfolio
</title>
<style type="text/css">
#menu {
position:absolute;
left:300px;
top:300px;
width:100px;
height:50px;
z-index:1;
background-color:#fff;
display:block;
}
#menu2 {
position:absolute;
left:300px;
top:300px;
width:1px;
height:50px;
z-index:2;
background-color:#000;
display:block;
}
</style>
<script type="text/javascript">
<!--
function open() {
document.getElementById("menu2").style.width = "100px";
}
var p = 100;
function close() {
if (p > 0) {
p-=5;
document.getElementById("menu2").style.width = p + "px";
setTimeout("close()", 30);
}
}
-->
</script>
</head>
<body>
<div id="menu" onMouseOver="function open();" onMouseOut="function close();">
<a href="javascript
:;" onMouseOver="function open();" onMouseOut="function close();">Hola</a>
</div>
<div id="menu2"></div>
</body>
</html>