Me gustaria que fuera animado pero... algo asi no me esta funcionando
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
.propiedades {
position:absolute;
top:10px;
left:10px;
width:322px;
height:198px;
border:1px solid #000;
background-color:#f00;
}
</style>
<script type="text/javascript">
var c=10; /* intial starting position - equal to set css value */
var distance=400; /* a higher value produces a greater distance */
var speed=10; /* a higher value produces a slower speed */
function movediv(){
document.getElementById('mydiv').onmouseover=funct ion(){}
document.getElementById('mydiv').style.left=c+'px' ;
if(c>distance) {
clearTimeout(move);
return;
}
c++;
move=setTimeout('movediv()',speed);
}
function movedivre(){
document.getElementById('mydiv').onmouseout=functi on(){}
document.getElementById('mydiv').style.left=c+'px' ;
if(c>distance) {
clearTimeout(move);
return;
}
c--;
move=setTimeout('movediv()',speed);
}
onload=function(){
document.getElementById('mydiv').onmouseover=moved iv;
document.getElementById('mydiv').onmouseout=movedi vre;
}
</script>
</head>
<body>
<div class="propiedades" id="mydiv" onMouseOver="movediv()" onMouseOut="movedivre()"><a href="#">aaaaaaa</a></div>
</body>
</html>
que estoy haciendo mal?