Hola a todos,mi problema es que al mover capas hacia la derecha o
hacia abajo,estas,teniendo una posision definida por los estilos
css,empiezan desde la posisiòn 0 y,si trato de moverlas hacia la
izquierda o arriva,no se mueven,al menos que halla movido hacia la
derecha o abajo antes.Esto se deve a que el mètodo para moverlas es
a travèz de las propiedades left y top de los estilos css,por esto es que
al querer mover las capas hacia la derecha o abajo estas empiezan de
0,ya que el valor por defecto de las propiedades top y left es 0 y con
respecto a la izquierda y abajo,no se mueven ya que ya poseen el
valor 0 y no se les puede restar nada.
En el documento css tengo la posisiòn left y top de la capa
definidas,pero el còdigo javascript no toma como punto de partida
esas definiciones,espero que le puedan encontrar soluciòn, acà les
dejo el còdigo:
Código:
if(document.all)
{
doc=""
style=".style"
pixelLeft=".pixelLeft"
pixelTop=".pixelTop"
}
function moverDerecha(div,max,pix,vel)
{
if(eval(doc+div+style+pixelLeft)<max)
{eval(doc+div+style+pixelLeft+'+='+pix)}
timer0=setTimeout("moverDerecha('"+div+"',"+max+","+pix+","+vel+")"
,vel)
}
function moverIzquierda(div,max,min,pix,vel)
{
if(eval(doc+div+style+pixelLeft)<max &&
eval(doc+div+style+pixelLeft)>min)
{eval(doc+div+style+pixelLeft+'-='+pix)}
timer1=setTimeout("moverIzquierda('"+div+"',"+max+","+min+","+pix+"
,"+vel+")",vel)
}
function moverArriva(div,max,min,pix,vel)
{
if(eval(doc+div+style+pixelTop)<max &&
eval(doc+div+style+pixelTop)>min)
{eval(doc+div+style+pixelTop+'-='+pix)}
timer3=setTimeout("moverArriva('"+div+"',"+max+","+min+","+pix+","+
vel+")",vel)
}
function moverAbajo(div,max,pix,vel)
{
if(eval(doc+div+style+pixelTop)<max)
{eval(doc+div+style+pixelTop+'+='+pix)}
timer3=setTimeout("moverAbajo('"+div+"',"+max+","+pix+","+vel+")",v
el)
}
Acà el HTML:
Código:
<body>
<div id="microconstructor"></div>
<table>
<tr><td><a href="#" onmouseover="moverArriva('microconstructor',
500,0,1,30)" onmouseout="clearTimeout(timer3)"></a></td></tr>
<tr><td><a href="#"
onmouseover="moverIzquierda('microconstructor'500,0,1,30)"
onmouseout="clearTimeout(timer1)"></a>
<a href="#"
onmouseover="moverAbajo('microconstructor',400,1,30)"
onmouseout="clearTimeout(timer3)"></a>
<a href="#"
onmouseover="moverDerecha('microconstructor',950,1,30)"
onmouseout="clearTimeout(timer0)"></a></td>
</table>
</body>
Y acà cà el css:
Código:
#microconstructor{position:absolute;left:100px;top:200px;displ
ay:none}